diff --git a/packages/antd/test/__snapshots__/Object.test.tsx.snap b/packages/antd/test/__snapshots__/Object.test.tsx.snap
index 12ee8f5b25..432f3fd599 100644
--- a/packages/antd/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Object.test.tsx.snap
@@ -1,515 +1,349 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-object"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-object"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <fieldset
-                                  id="root_person"
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <div
-                                    className="ant-row css-dev-only-do-not-override-ac2jek"
-                                    style={
-                                      {
-                                        "marginLeft": -12,
-                                        "marginRight": -12,
-                                        "rowGap": undefined,
-                                      }
-                                    }
+                                  <fieldset
+                                    id="root_person"
                                   >
                                     <div
-                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
+                                      class="ant-row css-dev-only-do-not-override-ac2jek"
+                                      style="margin-left: -12px; margin-right: -12px;"
                                     >
-                                      <label
-                                        className=""
-                                        htmlFor="root_person__title"
-                                        onClick={[Function]}
-                                        title="person"
-                                      >
-                                        person
-                                      </label>
                                       <div
-                                        className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                        role="separator"
-                                        style={
-                                          {
-                                            "marginBlock": "1px",
-                                          }
-                                        }
-                                      />
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
+                                        class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <label
+                                          class=""
+                                          for="root_person__title"
+                                          title="person"
+                                        >
+                                          person
+                                        </label>
+                                        <div
+                                          class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                          role="separator"
+                                          style="margin-block: 1px;"
+                                        />
+                                      </div>
                                       <div
-                                        className="rjsf-field rjsf-field-string"
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                          class="rjsf-field rjsf-field-string"
                                         >
                                           <div
-                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "rowGap": undefined,
-                                              }
-                                            }
+                                            class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                           >
                                             <div
-                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
+                                              class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                             >
-                                              <label
-                                                className=""
-                                                htmlFor="root_person_name"
-                                                title="name"
+                                              <div
+                                                class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                               >
-                                                name
-                                              </label>
-                                            </div>
-                                            <div
-                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
-                                            >
+                                                <label
+                                                  class=""
+                                                  for="root_person_name"
+                                                  title="name"
+                                                >
+                                                  name
+                                                </label>
+                                              </div>
                                               <div
-                                                className="ant-form-item-control-input"
+                                                class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                               >
                                                 <div
-                                                  className="ant-form-item-control-input-content"
+                                                  class="ant-form-item-control-input"
                                                 >
-                                                  <span
-                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                    onClick={[Function]}
-                                                    style={
-                                                      {
-                                                        "width": "100%",
-                                                      }
-                                                    }
+                                                  <div
+                                                    class="ant-form-item-control-input-content"
                                                   >
-                                                    <input
-                                                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                                                      className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                      disabled={false}
-                                                      id="root_person_name"
-                                                      name="root[person][name]"
-                                                      onBlur={[Function]}
-                                                      onChange={[Function]}
-                                                      onCompositionEnd={[Function]}
-                                                      onCompositionStart={[Function]}
-                                                      onFocus={[Function]}
-                                                      onKeyDown={[Function]}
-                                                      onKeyUp={[Function]}
-                                                      placeholder=""
-                                                      type="text"
-                                                      value=""
-                                                    />
                                                     <span
-                                                      className="ant-input-suffix"
-                                                    />
-                                                  </span>
+                                                      class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                      style="width: 100%;"
+                                                    >
+                                                      <input
+                                                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                                        class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                        id="root_person_name"
+                                                        name="root[person][name]"
+                                                        placeholder=""
+                                                        type="text"
+                                                        value=""
+                                                      />
+                                                      <span
+                                                        class="ant-input-suffix"
+                                                      />
+                                                    </span>
+                                                  </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
                                         </div>
                                       </div>
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
                                       <div
-                                        className="rjsf-field rjsf-field-object"
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                          class="rjsf-field rjsf-field-object"
                                         >
                                           <div
-                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "rowGap": undefined,
-                                              }
-                                            }
+                                            class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                           >
                                             <div
-                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
+                                              class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                             >
                                               <div
-                                                className="ant-form-item-control-input"
+                                                class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                               >
                                                 <div
-                                                  className="ant-form-item-control-input-content"
+                                                  class="ant-form-item-control-input"
                                                 >
-                                                  <fieldset
-                                                    id="root_person_address"
+                                                  <div
+                                                    class="ant-form-item-control-input-content"
                                                   >
-                                                    <div
-                                                      className="ant-row css-dev-only-do-not-override-ac2jek"
-                                                      style={
-                                                        {
-                                                          "marginLeft": -12,
-                                                          "marginRight": -12,
-                                                          "rowGap": undefined,
-                                                        }
-                                                      }
+                                                    <fieldset
+                                                      id="root_person_address"
                                                     >
                                                       <div
-                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
+                                                        class="ant-row css-dev-only-do-not-override-ac2jek"
+                                                        style="margin-left: -12px; margin-right: -12px;"
                                                       >
-                                                        <label
-                                                          className=""
-                                                          htmlFor="root_person_address__title"
-                                                          onClick={[Function]}
-                                                          title="address"
-                                                        >
-                                                          address
-                                                        </label>
                                                         <div
-                                                          className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                                          role="separator"
-                                                          style={
-                                                            {
-                                                              "marginBlock": "1px",
-                                                            }
-                                                          }
-                                                        />
-                                                      </div>
-                                                      <div
-                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
-                                                      >
+                                                          class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
+                                                        >
+                                                          <label
+                                                            class=""
+                                                            for="root_person_address__title"
+                                                            title="address"
+                                                          >
+                                                            address
+                                                          </label>
+                                                          <div
+                                                            class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                                            role="separator"
+                                                            style="margin-block: 1px;"
+                                                          />
+                                                        </div>
                                                         <div
-                                                          className="rjsf-field rjsf-field-string"
+                                                          class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
                                                         >
                                                           <div
-                                                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                                            class="rjsf-field rjsf-field-string"
                                                           >
                                                             <div
-                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                              style={
-                                                                {
-                                                                  "rowGap": undefined,
-                                                                }
-                                                              }
+                                                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                                             >
                                                               <div
-                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
+                                                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                               >
-                                                                <label
-                                                                  className=""
-                                                                  htmlFor="root_person_address_street"
-                                                                  title="street"
+                                                                <div
+                                                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                                 >
-                                                                  street
-                                                                </label>
-                                                              </div>
-                                                              <div
-                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
-                                                              >
+                                                                  <label
+                                                                    class=""
+                                                                    for="root_person_address_street"
+                                                                    title="street"
+                                                                  >
+                                                                    street
+                                                                  </label>
+                                                                </div>
                                                                 <div
-                                                                  className="ant-form-item-control-input"
+                                                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                                 >
                                                                   <div
-                                                                    className="ant-form-item-control-input-content"
+                                                                    class="ant-form-item-control-input"
                                                                   >
-                                                                    <span
-                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                                      onClick={[Function]}
-                                                                      style={
-                                                                        {
-                                                                          "width": "100%",
-                                                                        }
-                                                                      }
+                                                                    <div
+                                                                      class="ant-form-item-control-input-content"
                                                                     >
-                                                                      <input
-                                                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                                        disabled={false}
-                                                                        id="root_person_address_street"
-                                                                        name="root[person][address][street]"
-                                                                        onBlur={[Function]}
-                                                                        onChange={[Function]}
-                                                                        onCompositionEnd={[Function]}
-                                                                        onCompositionStart={[Function]}
-                                                                        onFocus={[Function]}
-                                                                        onKeyDown={[Function]}
-                                                                        onKeyUp={[Function]}
-                                                                        placeholder=""
-                                                                        type="text"
-                                                                        value=""
-                                                                      />
                                                                       <span
-                                                                        className="ant-input-suffix"
-                                                                      />
-                                                                    </span>
+                                                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                                        style="width: 100%;"
+                                                                      >
+                                                                        <input
+                                                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                                          id="root_person_address_street"
+                                                                          name="root[person][address][street]"
+                                                                          placeholder=""
+                                                                          type="text"
+                                                                          value=""
+                                                                        />
+                                                                        <span
+                                                                          class="ant-input-suffix"
+                                                                        />
+                                                                      </span>
+                                                                    </div>
                                                                   </div>
                                                                 </div>
                                                               </div>
                                                             </div>
                                                           </div>
                                                         </div>
-                                                      </div>
-                                                      <div
-                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
-                                                      >
                                                         <div
-                                                          className="rjsf-field rjsf-field-string"
+                                                          class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
                                                         >
                                                           <div
-                                                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                                            class="rjsf-field rjsf-field-string"
                                                           >
                                                             <div
-                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                              style={
-                                                                {
-                                                                  "rowGap": undefined,
-                                                                }
-                                                              }
+                                                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                                             >
                                                               <div
-                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
+                                                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                               >
-                                                                <label
-                                                                  className=""
-                                                                  htmlFor="root_person_address_city"
-                                                                  title="city"
+                                                                <div
+                                                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                                 >
-                                                                  city
-                                                                </label>
-                                                              </div>
-                                                              <div
-                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
-                                                              >
+                                                                  <label
+                                                                    class=""
+                                                                    for="root_person_address_city"
+                                                                    title="city"
+                                                                  >
+                                                                    city
+                                                                  </label>
+                                                                </div>
                                                                 <div
-                                                                  className="ant-form-item-control-input"
+                                                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                                 >
                                                                   <div
-                                                                    className="ant-form-item-control-input-content"
+                                                                    class="ant-form-item-control-input"
                                                                   >
-                                                                    <span
-                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                                      onClick={[Function]}
-                                                                      style={
-                                                                        {
-                                                                          "width": "100%",
-                                                                        }
-                                                                      }
+                                                                    <div
+                                                                      class="ant-form-item-control-input-content"
                                                                     >
-                                                                      <input
-                                                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                                        disabled={false}
-                                                                        id="root_person_address_city"
-                                                                        name="root[person][address][city]"
-                                                                        onBlur={[Function]}
-                                                                        onChange={[Function]}
-                                                                        onCompositionEnd={[Function]}
-                                                                        onCompositionStart={[Function]}
-                                                                        onFocus={[Function]}
-                                                                        onKeyDown={[Function]}
-                                                                        onKeyUp={[Function]}
-                                                                        placeholder=""
-                                                                        type="text"
-                                                                        value=""
-                                                                      />
                                                                       <span
-                                                                        className="ant-input-suffix"
-                                                                      />
-                                                                    </span>
+                                                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                                        style="width: 100%;"
+                                                                      >
+                                                                        <input
+                                                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                                          id="root_person_address_city"
+                                                                          name="root[person][address][city]"
+                                                                          placeholder=""
+                                                                          type="text"
+                                                                          value=""
+                                                                        />
+                                                                        <span
+                                                                          class="ant-input-suffix"
+                                                                        />
+                                                                      </span>
+                                                                    </div>
                                                                   </div>
                                                                 </div>
                                                               </div>
                                                             </div>
                                                           </div>
                                                         </div>
-                                                      </div>
-                                                      <div
-                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
-                                                      >
                                                         <div
-                                                          className="rjsf-field rjsf-field-string"
+                                                          class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
                                                         >
                                                           <div
-                                                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                                            class="rjsf-field rjsf-field-string"
                                                           >
                                                             <div
-                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                              style={
-                                                                {
-                                                                  "rowGap": undefined,
-                                                                }
-                                                              }
+                                                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                                             >
                                                               <div
-                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
+                                                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                               >
-                                                                <label
-                                                                  className=""
-                                                                  htmlFor="root_person_address_country"
-                                                                  title="country"
+                                                                <div
+                                                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                                 >
-                                                                  country
-                                                                </label>
-                                                              </div>
-                                                              <div
-                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
-                                                              >
+                                                                  <label
+                                                                    class=""
+                                                                    for="root_person_address_country"
+                                                                    title="country"
+                                                                  >
+                                                                    country
+                                                                  </label>
+                                                                </div>
                                                                 <div
-                                                                  className="ant-form-item-control-input"
+                                                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                                 >
                                                                   <div
-                                                                    className="ant-form-item-control-input-content"
+                                                                    class="ant-form-item-control-input"
                                                                   >
-                                                                    <span
-                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                                      onClick={[Function]}
-                                                                      style={
-                                                                        {
-                                                                          "width": "100%",
-                                                                        }
-                                                                      }
+                                                                    <div
+                                                                      class="ant-form-item-control-input-content"
                                                                     >
-                                                                      <input
-                                                                        aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                                        disabled={false}
-                                                                        id="root_person_address_country"
-                                                                        name="root[person][address][country]"
-                                                                        onBlur={[Function]}
-                                                                        onChange={[Function]}
-                                                                        onCompositionEnd={[Function]}
-                                                                        onCompositionStart={[Function]}
-                                                                        onFocus={[Function]}
-                                                                        onKeyDown={[Function]}
-                                                                        onKeyUp={[Function]}
-                                                                        placeholder=""
-                                                                        type="text"
-                                                                        value=""
-                                                                      />
                                                                       <span
-                                                                        className="ant-input-suffix"
-                                                                      />
-                                                                    </span>
+                                                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                                        style="width: 100%;"
+                                                                      >
+                                                                        <input
+                                                                          aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                                          id="root_person_address_country"
+                                                                          name="root[person][address][country]"
+                                                                          placeholder=""
+                                                                          type="text"
+                                                                          value=""
+                                                                        />
+                                                                        <span
+                                                                          class="ant-input-suffix"
+                                                                        />
+                                                                      </span>
+                                                                    </div>
                                                                   </div>
                                                                 </div>
                                                               </div>
@@ -517,8 +351,8 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                                                           </div>
                                                         </div>
                                                       </div>
-                                                    </div>
-                                                  </fieldset>
+                                                    </fieldset>
+                                                  </div>
                                                 </div>
                                               </div>
                                             </div>
@@ -526,8 +360,8 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                                         </div>
                                       </div>
                                     </div>
-                                  </div>
-                                </fieldset>
+                                  </fieldset>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -535,755 +369,545 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_name"
-                              title="name"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              name
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_name"
+                                title="name"
+                              >
+                                name
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_name__error root_name__description root_name__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_name"
-                                    name="root[name]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value="John"
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_name__error root_name__description root_name__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_name"
+                                      name="root[name]"
+                                      placeholder=""
+                                      type="text"
+                                      value="John"
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_customField-key"
-                                    title="customField Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    customField Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_customField-key"
+                                      title="customField Key"
+                                    >
+                                      customField Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_customField-key"
-                                          name="root_customField-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="customField"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_customField-key"
+                                            name="root_customField-key"
+                                            type="text"
+                                            value="customField"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_customField"
-                                  title="customField"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  customField
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_customField"
+                                    title="customField"
+                                  >
+                                    customField
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_customField__error root_customField__description root_customField__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_customField"
-                                        name="root[customField]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="customValue"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_customField__error root_customField__description root_customField__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_customField"
+                                          name="root[customField]"
+                                          placeholder=""
+                                          type="text"
+                                          value="customValue"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_customField__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_customField__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_name"
-                              title="name"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              name
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_name"
+                                title="name"
+                              >
+                                name
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_name__error root_name__description root_name__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_name"
-                                    name="root[name]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value="Alice"
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_name__error root_name__description root_name__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_name"
+                                      name="root[name]"
+                                      placeholder=""
+                                      type="text"
+                                      value="Alice"
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_age"
-                              title="age"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              age
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_age"
+                                title="age"
+                              >
+                                age
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_age__error root_age__description root_age__help"
-                                        aria-valuenow="30"
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_age"
-                                        name="root[age]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value="30"
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_age__error root_age__description root_age__help"
+                                          aria-valuenow="30"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_age"
+                                          name="root[age]"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value="30"
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
                             </div>
@@ -1291,602 +915,473 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-boolean"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-boolean"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <label
-                                  className="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-ac2jek"
-                                  onClick={[Function]}
-                                  style={{}}
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <span
-                                    className="ant-checkbox ant-wave-target css-dev-only-do-not-override-ac2jek ant-checkbox-checked"
+                                  <label
+                                    class="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-ac2jek"
                                   >
-                                    <input
-                                      aria-describedby="root_active__error root_active__description root_active__help"
-                                      autoFocus={false}
-                                      checked={true}
-                                      className="ant-checkbox-input"
-                                      disabled={false}
-                                      id="root_active"
-                                      name="root[active]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onClick={[Function]}
-                                      onFocus={[Function]}
-                                      type="checkbox"
-                                    />
                                     <span
-                                      className="ant-checkbox-inner"
-                                    />
-                                  </span>
-                                  <span
-                                    className="ant-checkbox-label"
-                                  >
-                                    active
-                                  </span>
-                                </label>
+                                      class="ant-checkbox ant-wave-target css-dev-only-do-not-override-ac2jek ant-checkbox-checked"
+                                    >
+                                      <input
+                                        aria-describedby="root_active__error root_active__description root_active__help"
+                                        checked=""
+                                        class="ant-checkbox-input"
+                                        id="root_active"
+                                        name="root[active]"
+                                        type="checkbox"
+                                      />
+                                      <span
+                                        class="ant-checkbox-inner"
+                                      />
+                                    </span>
+                                    <span
+                                      class="ant-checkbox-label"
+                                    >
+                                      active
+                                    </span>
+                                  </label>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-array"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-array"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <fieldset
-                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
-                                  id="root_tags"
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <div
-                                    className="ant-row css-dev-only-do-not-override-ac2jek"
-                                    style={
-                                      {
-                                        "marginLeft": -12,
-                                        "marginRight": -12,
-                                        "rowGap": undefined,
-                                      }
-                                    }
+                                  <fieldset
+                                    class="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                    id="root_tags"
                                   >
                                     <div
-                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
+                                      class="ant-row css-dev-only-do-not-override-ac2jek"
+                                      style="margin-left: -12px; margin-right: -12px;"
                                     >
-                                      <label
-                                        className=""
-                                        htmlFor="root_tags__title"
-                                        onClick={[Function]}
-                                        title="tags"
-                                      >
-                                        tags
-                                      </label>
                                       <div
-                                        className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                        role="separator"
-                                        style={
-                                          {
-                                            "marginBlock": "1px",
-                                          }
-                                        }
-                                      />
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
+                                        class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <label
+                                          class=""
+                                          for="root_tags__title"
+                                          title="tags"
+                                        >
+                                          tags
+                                        </label>
+                                        <div
+                                          class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                          role="separator"
+                                          style="margin-block: 1px;"
+                                        />
+                                      </div>
                                       <div
-                                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
+                                        class="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "1",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
+                                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
                                         >
                                           <div
-                                            className="rjsf-field rjsf-field-string"
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                                           >
                                             <div
-                                              className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                              class="rjsf-field rjsf-field-string"
                                             >
                                               <div
-                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                style={
-                                                  {
-                                                    "rowGap": undefined,
-                                                  }
-                                                }
+                                                class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                               >
                                                 <div
-                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
+                                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                 >
-                                                  <label
-                                                    className="ant-form-item-required"
-                                                    htmlFor="root_tags_0"
-                                                    title="tags-1"
+                                                  <div
+                                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                   >
-                                                    tags-1
-                                                  </label>
-                                                </div>
-                                                <div
-                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
-                                                >
+                                                    <label
+                                                      class="ant-form-item-required"
+                                                      for="root_tags_0"
+                                                      title="tags-1"
+                                                    >
+                                                      tags-1
+                                                    </label>
+                                                  </div>
                                                   <div
-                                                    className="ant-form-item-control-input"
+                                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                   >
                                                     <div
-                                                      className="ant-form-item-control-input-content"
+                                                      class="ant-form-item-control-input"
                                                     >
-                                                      <span
-                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                        onClick={[Function]}
-                                                        style={
-                                                          {
-                                                            "width": "100%",
-                                                          }
-                                                        }
+                                                      <div
+                                                        class="ant-form-item-control-input-content"
                                                       >
-                                                        <input
-                                                          aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                          disabled={false}
-                                                          id="root_tags_0"
-                                                          name="root[tags][0]"
-                                                          onBlur={[Function]}
-                                                          onChange={[Function]}
-                                                          onCompositionEnd={[Function]}
-                                                          onCompositionStart={[Function]}
-                                                          onFocus={[Function]}
-                                                          onKeyDown={[Function]}
-                                                          onKeyUp={[Function]}
-                                                          placeholder=""
-                                                          type="text"
-                                                          value="developer"
-                                                        />
                                                         <span
-                                                          className="ant-input-suffix"
-                                                        />
-                                                      </span>
+                                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                          style="width: 100%;"
+                                                        >
+                                                          <input
+                                                            aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                            id="root_tags_0"
+                                                            name="root[tags][0]"
+                                                            placeholder=""
+                                                            type="text"
+                                                            value="developer"
+                                                          />
+                                                          <span
+                                                            class="ant-input-suffix"
+                                                          />
+                                                        </span>
+                                                      </div>
                                                     </div>
                                                   </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
-                                        </div>
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
                                           <div
-                                            className="ant-space-compact css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "width": "100%",
-                                              }
-                                            }
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                                           >
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
-                                              disabled={true}
-                                              id="root_tags_0__moveUp"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move up"
-                                              type="button"
+                                            <div
+                                              class="ant-space-compact css-dev-only-do-not-override-ac2jek"
+                                              style="width: 100%;"
                                             >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
+                                                disabled=""
+                                                id="root_tags_0__moveUp"
+                                                style="padding-top: 4px;"
+                                                title="Move up"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-up"
-                                                  className="anticon anticon-arrow-up"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-up"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-up"
+                                                    class="anticon anticon-arrow-up"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-up"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
-                                              disabled={false}
-                                              id="root_tags_0__moveDown"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move down"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
+                                                id="root_tags_0__moveDown"
+                                                style="padding-top: 4px;"
+                                                title="Move down"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-down"
-                                                  className="anticon anticon-arrow-down"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-down"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-down"
+                                                    class="anticon anticon-arrow-down"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-down"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
-                                              disabled={false}
-                                              id="root_tags_0__remove"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Remove"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
+                                                id="root_tags_0__remove"
+                                                style="padding-top: 4px;"
+                                                title="Remove"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="delete"
-                                                  className="anticon anticon-delete"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="delete"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="delete"
+                                                    class="anticon anticon-delete"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="delete"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
+                                              </button>
+                                            </div>
                                           </div>
                                         </div>
-                                      </div>
-                                      <div
-                                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
-                                      >
                                         <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "1",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
+                                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
                                         >
                                           <div
-                                            className="rjsf-field rjsf-field-string"
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                                           >
                                             <div
-                                              className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                              class="rjsf-field rjsf-field-string"
                                             >
                                               <div
-                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                style={
-                                                  {
-                                                    "rowGap": undefined,
-                                                  }
-                                                }
+                                                class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                               >
                                                 <div
-                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
+                                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                 >
-                                                  <label
-                                                    className="ant-form-item-required"
-                                                    htmlFor="root_tags_1"
-                                                    title="tags-2"
+                                                  <div
+                                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                   >
-                                                    tags-2
-                                                  </label>
-                                                </div>
-                                                <div
-                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
-                                                >
+                                                    <label
+                                                      class="ant-form-item-required"
+                                                      for="root_tags_1"
+                                                      title="tags-2"
+                                                    >
+                                                      tags-2
+                                                    </label>
+                                                  </div>
                                                   <div
-                                                    className="ant-form-item-control-input"
+                                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                   >
                                                     <div
-                                                      className="ant-form-item-control-input-content"
+                                                      class="ant-form-item-control-input"
                                                     >
-                                                      <span
-                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                        onClick={[Function]}
-                                                        style={
-                                                          {
-                                                            "width": "100%",
-                                                          }
-                                                        }
+                                                      <div
+                                                        class="ant-form-item-control-input-content"
                                                       >
-                                                        <input
-                                                          aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                          disabled={false}
-                                                          id="root_tags_1"
-                                                          name="root[tags][1]"
-                                                          onBlur={[Function]}
-                                                          onChange={[Function]}
-                                                          onCompositionEnd={[Function]}
-                                                          onCompositionStart={[Function]}
-                                                          onFocus={[Function]}
-                                                          onKeyDown={[Function]}
-                                                          onKeyUp={[Function]}
-                                                          placeholder=""
-                                                          type="text"
-                                                          value="designer"
-                                                        />
                                                         <span
-                                                          className="ant-input-suffix"
-                                                        />
-                                                      </span>
+                                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                          style="width: 100%;"
+                                                        >
+                                                          <input
+                                                            aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                            id="root_tags_1"
+                                                            name="root[tags][1]"
+                                                            placeholder=""
+                                                            type="text"
+                                                            value="designer"
+                                                          />
+                                                          <span
+                                                            class="ant-input-suffix"
+                                                          />
+                                                        </span>
+                                                      </div>
                                                     </div>
                                                   </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
-                                        </div>
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
                                           <div
-                                            className="ant-space-compact css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "width": "100%",
-                                              }
-                                            }
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                                           >
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
-                                              disabled={false}
-                                              id="root_tags_1__moveUp"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move up"
-                                              type="button"
+                                            <div
+                                              class="ant-space-compact css-dev-only-do-not-override-ac2jek"
+                                              style="width: 100%;"
                                             >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
+                                                id="root_tags_1__moveUp"
+                                                style="padding-top: 4px;"
+                                                title="Move up"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-up"
-                                                  className="anticon anticon-arrow-up"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-up"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-up"
+                                                    class="anticon anticon-arrow-up"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-up"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
-                                              disabled={true}
-                                              id="root_tags_1__moveDown"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move down"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
+                                                disabled=""
+                                                id="root_tags_1__moveDown"
+                                                style="padding-top: 4px;"
+                                                title="Move down"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-down"
-                                                  className="anticon anticon-arrow-down"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-down"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-down"
+                                                    class="anticon anticon-arrow-down"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-down"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
+                                                id="root_tags_1__remove"
+                                                style="padding-top: 4px;"
+                                                title="Remove"
+                                                type="button"
+                                              >
+                                                <span
+                                                  class="ant-btn-icon"
+                                                >
+                                                  <span
+                                                    aria-label="delete"
+                                                    class="anticon anticon-delete"
+                                                    role="img"
+                                                  >
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="delete"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      />
+                                                    </svg>
+                                                  </span>
+                                                </span>
+                                              </button>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <div
+                                          class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
+                                        >
+                                          <div
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
+                                          >
                                             <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
-                                              disabled={false}
-                                              id="root_tags_1__remove"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Remove"
+                                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-array-item-add"
+                                              id="root_tags__add"
+                                              style="padding-top: 4px;"
+                                              title="Add Item"
                                               type="button"
                                             >
                                               <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                                class="ant-btn-icon"
                                               >
                                                 <span
-                                                  aria-label="delete"
-                                                  className="anticon anticon-delete"
+                                                  aria-label="plus-circle"
+                                                  class="anticon anticon-plus-circle"
                                                   role="img"
                                                 >
                                                   <svg
                                                     aria-hidden="true"
-                                                    data-icon="delete"
+                                                    data-icon="plus-circle"
                                                     fill="currentColor"
                                                     focusable="false"
                                                     height="1em"
@@ -1894,7 +1389,10 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                                     width="1em"
                                                   >
                                                     <path
-                                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                                    />
+                                                    <path
+                                                      d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
                                                     />
                                                   </svg>
                                                 </span>
@@ -1904,81 +1402,8 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                         </div>
                                       </div>
                                     </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
-                                      <div
-                                        className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
-                                      >
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
-                                          <button
-                                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-array-item-add"
-                                            disabled={false}
-                                            id="root_tags__add"
-                                            onClick={[Function]}
-                                            style={
-                                              {
-                                                "paddingTop": "4px",
-                                              }
-                                            }
-                                            title="Add Item"
-                                            type="button"
-                                          >
-                                            <span
-                                              className="ant-btn-icon"
-                                              style={{}}
-                                            >
-                                              <span
-                                                aria-label="plus-circle"
-                                                className="anticon anticon-plus-circle"
-                                                role="img"
-                                              >
-                                                <svg
-                                                  aria-hidden="true"
-                                                  data-icon="plus-circle"
-                                                  fill="currentColor"
-                                                  focusable="false"
-                                                  height="1em"
-                                                  viewBox="64 64 896 896"
-                                                  width="1em"
-                                                >
-                                                  <path
-                                                    d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                                                  />
-                                                  <path
-                                                    d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                                                  />
-                                                </svg>
-                                              </span>
-                                            </span>
-                                          </button>
-                                        </div>
-                                      </div>
-                                    </div>
-                                  </div>
-                                </fieldset>
+                                  </fieldset>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -1986,388 +1411,288 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_firstName"
-                              title="firstName"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              firstName
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_firstName"
+                                title="firstName"
+                              >
+                                firstName
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_firstName"
-                                    name="root[firstName]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_firstName"
+                                      name="root[firstName]"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_lastName"
-                              title="lastName"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              lastName
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_lastName"
+                                title="lastName"
+                              >
+                                lastName
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_lastName"
-                                    name="root[lastName]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_lastName"
+                                      name="root[lastName]"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_age"
-                              title="age"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              age
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_age"
+                                title="age"
+                              >
+                                age
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_age__error root_age__description root_age__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_age"
-                                        name="root[age]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_age__error root_age__description root_age__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_age"
+                                          name="root[age]"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
                             </div>
@@ -2376,456 +1701,312 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-object"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-object"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <fieldset
-                                  id="root_person"
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <div
-                                    className="ant-row css-dev-only-do-not-override-ac2jek"
-                                    style={
-                                      {
-                                        "marginLeft": -12,
-                                        "marginRight": -12,
-                                        "rowGap": undefined,
-                                      }
-                                    }
+                                  <fieldset
+                                    id="root_person"
                                   >
                                     <div
-                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
+                                      class="ant-row css-dev-only-do-not-override-ac2jek"
+                                      style="margin-left: -12px; margin-right: -12px;"
                                     >
-                                      <label
-                                        className=""
-                                        htmlFor="root_person__title"
-                                        onClick={[Function]}
-                                        title="person"
-                                      >
-                                        person
-                                      </label>
                                       <div
-                                        className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                        role="separator"
-                                        style={
-                                          {
-                                            "marginBlock": "1px",
-                                          }
-                                        }
-                                      />
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
+                                        class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <label
+                                          class=""
+                                          for="root_person__title"
+                                          title="person"
+                                        >
+                                          person
+                                        </label>
+                                        <div
+                                          class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                          role="separator"
+                                          style="margin-block: 1px;"
+                                        />
+                                      </div>
                                       <div
-                                        className="rjsf-field rjsf-field-string"
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                          class="rjsf-field rjsf-field-string"
                                         >
                                           <div
-                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "rowGap": undefined,
-                                              }
-                                            }
+                                            class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                           >
                                             <div
-                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
+                                              class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                             >
-                                              <label
-                                                className=""
-                                                htmlFor="root_person_name"
-                                                title="name"
+                                              <div
+                                                class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                               >
-                                                name
-                                              </label>
-                                            </div>
-                                            <div
-                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
-                                            >
+                                                <label
+                                                  class=""
+                                                  for="root_person_name"
+                                                  title="name"
+                                                >
+                                                  name
+                                                </label>
+                                              </div>
                                               <div
-                                                className="ant-form-item-control-input"
+                                                class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                               >
                                                 <div
-                                                  className="ant-form-item-control-input-content"
+                                                  class="ant-form-item-control-input"
                                                 >
-                                                  <span
-                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                    onClick={[Function]}
-                                                    style={
-                                                      {
-                                                        "width": "100%",
-                                                      }
-                                                    }
+                                                  <div
+                                                    class="ant-form-item-control-input-content"
                                                   >
-                                                    <input
-                                                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                                                      className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                      disabled={false}
-                                                      id="root_person_name"
-                                                      name="root.person.name"
-                                                      onBlur={[Function]}
-                                                      onChange={[Function]}
-                                                      onCompositionEnd={[Function]}
-                                                      onCompositionStart={[Function]}
-                                                      onFocus={[Function]}
-                                                      onKeyDown={[Function]}
-                                                      onKeyUp={[Function]}
-                                                      placeholder=""
-                                                      type="text"
-                                                      value=""
-                                                    />
                                                     <span
-                                                      className="ant-input-suffix"
-                                                    />
-                                                  </span>
+                                                      class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                      style="width: 100%;"
+                                                    >
+                                                      <input
+                                                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                                        class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                        id="root_person_name"
+                                                        name="root.person.name"
+                                                        placeholder=""
+                                                        type="text"
+                                                        value=""
+                                                      />
+                                                      <span
+                                                        class="ant-input-suffix"
+                                                      />
+                                                    </span>
+                                                  </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
                                         </div>
                                       </div>
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
                                       <div
-                                        className="rjsf-field rjsf-field-object"
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                          class="rjsf-field rjsf-field-object"
                                         >
                                           <div
-                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "rowGap": undefined,
-                                              }
-                                            }
+                                            class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                           >
                                             <div
-                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                              style={{}}
+                                              class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                             >
                                               <div
-                                                className="ant-form-item-control-input"
+                                                class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                               >
                                                 <div
-                                                  className="ant-form-item-control-input-content"
+                                                  class="ant-form-item-control-input"
                                                 >
-                                                  <fieldset
-                                                    id="root_person_address"
+                                                  <div
+                                                    class="ant-form-item-control-input-content"
                                                   >
-                                                    <div
-                                                      className="ant-row css-dev-only-do-not-override-ac2jek"
-                                                      style={
-                                                        {
-                                                          "marginLeft": -12,
-                                                          "marginRight": -12,
-                                                          "rowGap": undefined,
-                                                        }
-                                                      }
+                                                    <fieldset
+                                                      id="root_person_address"
                                                     >
                                                       <div
-                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
+                                                        class="ant-row css-dev-only-do-not-override-ac2jek"
+                                                        style="margin-left: -12px; margin-right: -12px;"
                                                       >
-                                                        <label
-                                                          className=""
-                                                          htmlFor="root_person_address__title"
-                                                          onClick={[Function]}
-                                                          title="address"
-                                                        >
-                                                          address
-                                                        </label>
                                                         <div
-                                                          className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                                          role="separator"
-                                                          style={
-                                                            {
-                                                              "marginBlock": "1px",
-                                                            }
-                                                          }
-                                                        />
-                                                      </div>
-                                                      <div
-                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
-                                                      >
+                                                          class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
+                                                        >
+                                                          <label
+                                                            class=""
+                                                            for="root_person_address__title"
+                                                            title="address"
+                                                          >
+                                                            address
+                                                          </label>
+                                                          <div
+                                                            class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                                            role="separator"
+                                                            style="margin-block: 1px;"
+                                                          />
+                                                        </div>
                                                         <div
-                                                          className="rjsf-field rjsf-field-string"
+                                                          class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
                                                         >
                                                           <div
-                                                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                                            class="rjsf-field rjsf-field-string"
                                                           >
                                                             <div
-                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                              style={
-                                                                {
-                                                                  "rowGap": undefined,
-                                                                }
-                                                              }
+                                                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                                             >
                                                               <div
-                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
+                                                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                               >
-                                                                <label
-                                                                  className=""
-                                                                  htmlFor="root_person_address_street"
-                                                                  title="street"
+                                                                <div
+                                                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                                 >
-                                                                  street
-                                                                </label>
-                                                              </div>
-                                                              <div
-                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
-                                                              >
+                                                                  <label
+                                                                    class=""
+                                                                    for="root_person_address_street"
+                                                                    title="street"
+                                                                  >
+                                                                    street
+                                                                  </label>
+                                                                </div>
                                                                 <div
-                                                                  className="ant-form-item-control-input"
+                                                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                                 >
                                                                   <div
-                                                                    className="ant-form-item-control-input-content"
+                                                                    class="ant-form-item-control-input"
                                                                   >
-                                                                    <span
-                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                                      onClick={[Function]}
-                                                                      style={
-                                                                        {
-                                                                          "width": "100%",
-                                                                        }
-                                                                      }
+                                                                    <div
+                                                                      class="ant-form-item-control-input-content"
                                                                     >
-                                                                      <input
-                                                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                                        disabled={false}
-                                                                        id="root_person_address_street"
-                                                                        name="root.person.address.street"
-                                                                        onBlur={[Function]}
-                                                                        onChange={[Function]}
-                                                                        onCompositionEnd={[Function]}
-                                                                        onCompositionStart={[Function]}
-                                                                        onFocus={[Function]}
-                                                                        onKeyDown={[Function]}
-                                                                        onKeyUp={[Function]}
-                                                                        placeholder=""
-                                                                        type="text"
-                                                                        value=""
-                                                                      />
                                                                       <span
-                                                                        className="ant-input-suffix"
-                                                                      />
-                                                                    </span>
+                                                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                                        style="width: 100%;"
+                                                                      >
+                                                                        <input
+                                                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                                          id="root_person_address_street"
+                                                                          name="root.person.address.street"
+                                                                          placeholder=""
+                                                                          type="text"
+                                                                          value=""
+                                                                        />
+                                                                        <span
+                                                                          class="ant-input-suffix"
+                                                                        />
+                                                                      </span>
+                                                                    </div>
                                                                   </div>
                                                                 </div>
                                                               </div>
                                                             </div>
                                                           </div>
                                                         </div>
-                                                      </div>
-                                                      <div
-                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                                        style={
-                                                          {
-                                                            "paddingLeft": 12,
-                                                            "paddingRight": 12,
-                                                          }
-                                                        }
-                                                      >
                                                         <div
-                                                          className="rjsf-field rjsf-field-string"
+                                                          class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                                          style="padding-left: 12px; padding-right: 12px;"
                                                         >
                                                           <div
-                                                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                                            class="rjsf-field rjsf-field-string"
                                                           >
                                                             <div
-                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                              style={
-                                                                {
-                                                                  "rowGap": undefined,
-                                                                }
-                                                              }
+                                                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                                             >
                                                               <div
-                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
+                                                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                               >
-                                                                <label
-                                                                  className=""
-                                                                  htmlFor="root_person_address_city"
-                                                                  title="city"
+                                                                <div
+                                                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                                 >
-                                                                  city
-                                                                </label>
-                                                              </div>
-                                                              <div
-                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                                style={{}}
-                                                              >
+                                                                  <label
+                                                                    class=""
+                                                                    for="root_person_address_city"
+                                                                    title="city"
+                                                                  >
+                                                                    city
+                                                                  </label>
+                                                                </div>
                                                                 <div
-                                                                  className="ant-form-item-control-input"
+                                                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                                 >
                                                                   <div
-                                                                    className="ant-form-item-control-input-content"
+                                                                    class="ant-form-item-control-input"
                                                                   >
-                                                                    <span
-                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                                      onClick={[Function]}
-                                                                      style={
-                                                                        {
-                                                                          "width": "100%",
-                                                                        }
-                                                                      }
+                                                                    <div
+                                                                      class="ant-form-item-control-input-content"
                                                                     >
-                                                                      <input
-                                                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                                        disabled={false}
-                                                                        id="root_person_address_city"
-                                                                        name="root.person.address.city"
-                                                                        onBlur={[Function]}
-                                                                        onChange={[Function]}
-                                                                        onCompositionEnd={[Function]}
-                                                                        onCompositionStart={[Function]}
-                                                                        onFocus={[Function]}
-                                                                        onKeyDown={[Function]}
-                                                                        onKeyUp={[Function]}
-                                                                        placeholder=""
-                                                                        type="text"
-                                                                        value=""
-                                                                      />
                                                                       <span
-                                                                        className="ant-input-suffix"
-                                                                      />
-                                                                    </span>
+                                                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                                        style="width: 100%;"
+                                                                      >
+                                                                        <input
+                                                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                                          id="root_person_address_city"
+                                                                          name="root.person.address.city"
+                                                                          placeholder=""
+                                                                          type="text"
+                                                                          value=""
+                                                                        />
+                                                                        <span
+                                                                          class="ant-input-suffix"
+                                                                        />
+                                                                      </span>
+                                                                    </div>
                                                                   </div>
                                                                 </div>
                                                               </div>
@@ -2833,8 +2014,8 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
                                                           </div>
                                                         </div>
                                                       </div>
-                                                    </div>
-                                                  </fieldset>
+                                                    </fieldset>
+                                                  </div>
                                                 </div>
                                               </div>
                                             </div>
@@ -2842,8 +2023,8 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
                                         </div>
                                       </div>
                                     </div>
-                                  </div>
-                                </fieldset>
+                                  </fieldset>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -2851,306 +2032,232 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_name"
-                              title="name"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              name
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_name"
+                                title="name"
+                              >
+                                name
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_name__error root_name__description root_name__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_name"
-                                    name="root.name"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value="Test"
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_name__error root_name__description root_name__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_name"
+                                      name="root.name"
+                                      placeholder=""
+                                      type="text"
+                                      value="Test"
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_count"
-                              title="count"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              count
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_count"
+                                title="count"
+                              >
+                                count
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_count__error root_count__description root_count__help"
-                                        aria-valuenow="5"
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_count"
-                                        name="root.count"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value="5"
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_count__error root_count__description root_count__help"
+                                          aria-valuenow="5"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_count"
+                                          name="root.count"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value="5"
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
                             </div>
@@ -3158,530 +2265,420 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-array"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-array"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <fieldset
-                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
-                                  id="root_items"
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <div
-                                    className="ant-row css-dev-only-do-not-override-ac2jek"
-                                    style={
-                                      {
-                                        "marginLeft": -12,
-                                        "marginRight": -12,
-                                        "rowGap": undefined,
-                                      }
-                                    }
+                                  <fieldset
+                                    class="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                    id="root_items"
                                   >
                                     <div
-                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
+                                      class="ant-row css-dev-only-do-not-override-ac2jek"
+                                      style="margin-left: -12px; margin-right: -12px;"
                                     >
-                                      <label
-                                        className=""
-                                        htmlFor="root_items__title"
-                                        onClick={[Function]}
-                                        title="items"
-                                      >
-                                        items
-                                      </label>
                                       <div
-                                        className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                                        role="separator"
-                                        style={
-                                          {
-                                            "marginBlock": "1px",
-                                          }
-                                        }
-                                      />
-                                    </div>
-                                    <div
-                                      className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
+                                        class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <label
+                                          class=""
+                                          for="root_items__title"
+                                          title="items"
+                                        >
+                                          items
+                                        </label>
+                                        <div
+                                          class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                                          role="separator"
+                                          style="margin-block: 1px;"
+                                        />
+                                      </div>
                                       <div
-                                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
+                                        class="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
                                       >
                                         <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "1",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
+                                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
                                         >
                                           <div
-                                            className="rjsf-field rjsf-field-string"
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                                           >
                                             <div
-                                              className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                              class="rjsf-field rjsf-field-string"
                                             >
                                               <div
-                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                style={
-                                                  {
-                                                    "rowGap": undefined,
-                                                  }
-                                                }
+                                                class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                               >
                                                 <div
-                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
+                                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                 >
-                                                  <label
-                                                    className="ant-form-item-required"
-                                                    htmlFor="root_items_0"
-                                                    title="items-1"
+                                                  <div
+                                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                   >
-                                                    items-1
-                                                  </label>
-                                                </div>
-                                                <div
-                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
-                                                >
+                                                    <label
+                                                      class="ant-form-item-required"
+                                                      for="root_items_0"
+                                                      title="items-1"
+                                                    >
+                                                      items-1
+                                                    </label>
+                                                  </div>
                                                   <div
-                                                    className="ant-form-item-control-input"
+                                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                   >
                                                     <div
-                                                      className="ant-form-item-control-input-content"
+                                                      class="ant-form-item-control-input"
                                                     >
-                                                      <span
-                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                        onClick={[Function]}
-                                                        style={
-                                                          {
-                                                            "width": "100%",
-                                                          }
-                                                        }
+                                                      <div
+                                                        class="ant-form-item-control-input-content"
                                                       >
-                                                        <input
-                                                          aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                          disabled={false}
-                                                          id="root_items_0"
-                                                          name="root.items.0"
-                                                          onBlur={[Function]}
-                                                          onChange={[Function]}
-                                                          onCompositionEnd={[Function]}
-                                                          onCompositionStart={[Function]}
-                                                          onFocus={[Function]}
-                                                          onKeyDown={[Function]}
-                                                          onKeyUp={[Function]}
-                                                          placeholder=""
-                                                          type="text"
-                                                          value="a"
-                                                        />
                                                         <span
-                                                          className="ant-input-suffix"
-                                                        />
-                                                      </span>
+                                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                          style="width: 100%;"
+                                                        >
+                                                          <input
+                                                            aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                            id="root_items_0"
+                                                            name="root.items.0"
+                                                            placeholder=""
+                                                            type="text"
+                                                            value="a"
+                                                          />
+                                                          <span
+                                                            class="ant-input-suffix"
+                                                          />
+                                                        </span>
+                                                      </div>
                                                     </div>
                                                   </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
-                                        </div>
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
                                           <div
-                                            className="ant-space-compact css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "width": "100%",
-                                              }
-                                            }
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                                           >
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
-                                              disabled={true}
-                                              id="root_items_0__moveUp"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move up"
-                                              type="button"
+                                            <div
+                                              class="ant-space-compact css-dev-only-do-not-override-ac2jek"
+                                              style="width: 100%;"
                                             >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
+                                                disabled=""
+                                                id="root_items_0__moveUp"
+                                                style="padding-top: 4px;"
+                                                title="Move up"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-up"
-                                                  className="anticon anticon-arrow-up"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-up"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-up"
+                                                    class="anticon anticon-arrow-up"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-up"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
-                                              disabled={false}
-                                              id="root_items_0__moveDown"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move down"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
+                                                id="root_items_0__moveDown"
+                                                style="padding-top: 4px;"
+                                                title="Move down"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-down"
-                                                  className="anticon anticon-arrow-down"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-down"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-down"
+                                                    class="anticon anticon-arrow-down"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-down"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
-                                              disabled={false}
-                                              id="root_items_0__remove"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Remove"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
+                                                id="root_items_0__remove"
+                                                style="padding-top: 4px;"
+                                                title="Remove"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="delete"
-                                                  className="anticon anticon-delete"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="delete"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="delete"
+                                                    class="anticon anticon-delete"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="delete"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
+                                              </button>
+                                            </div>
                                           </div>
                                         </div>
-                                      </div>
-                                      <div
-                                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
-                                      >
                                         <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "1",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
+                                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
                                         >
                                           <div
-                                            className="rjsf-field rjsf-field-string"
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                                           >
                                             <div
-                                              className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                                              class="rjsf-field rjsf-field-string"
                                             >
                                               <div
-                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                                style={
-                                                  {
-                                                    "rowGap": undefined,
-                                                  }
-                                                }
+                                                class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                                               >
                                                 <div
-                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
+                                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                                 >
-                                                  <label
-                                                    className="ant-form-item-required"
-                                                    htmlFor="root_items_1"
-                                                    title="items-2"
+                                                  <div
+                                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                                   >
-                                                    items-2
-                                                  </label>
-                                                </div>
-                                                <div
-                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                                  style={{}}
-                                                >
+                                                    <label
+                                                      class="ant-form-item-required"
+                                                      for="root_items_1"
+                                                      title="items-2"
+                                                    >
+                                                      items-2
+                                                    </label>
+                                                  </div>
                                                   <div
-                                                    className="ant-form-item-control-input"
+                                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                                   >
                                                     <div
-                                                      className="ant-form-item-control-input-content"
+                                                      class="ant-form-item-control-input"
                                                     >
-                                                      <span
-                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                                        onClick={[Function]}
-                                                        style={
-                                                          {
-                                                            "width": "100%",
-                                                          }
-                                                        }
+                                                      <div
+                                                        class="ant-form-item-control-input-content"
                                                       >
-                                                        <input
-                                                          aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                                          disabled={false}
-                                                          id="root_items_1"
-                                                          name="root.items.1"
-                                                          onBlur={[Function]}
-                                                          onChange={[Function]}
-                                                          onCompositionEnd={[Function]}
-                                                          onCompositionStart={[Function]}
-                                                          onFocus={[Function]}
-                                                          onKeyDown={[Function]}
-                                                          onKeyUp={[Function]}
-                                                          placeholder=""
-                                                          type="text"
-                                                          value="b"
-                                                        />
                                                         <span
-                                                          className="ant-input-suffix"
-                                                        />
-                                                      </span>
+                                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                                          style="width: 100%;"
+                                                        >
+                                                          <input
+                                                            aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                                            id="root_items_1"
+                                                            name="root.items.1"
+                                                            placeholder=""
+                                                            type="text"
+                                                            value="b"
+                                                          />
+                                                          <span
+                                                            class="ant-input-suffix"
+                                                          />
+                                                        </span>
+                                                      </div>
                                                     </div>
                                                   </div>
                                                 </div>
                                               </div>
                                             </div>
                                           </div>
-                                        </div>
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
                                           <div
-                                            className="ant-space-compact css-dev-only-do-not-override-ac2jek"
-                                            style={
-                                              {
-                                                "width": "100%",
-                                              }
-                                            }
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                                           >
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
-                                              disabled={false}
-                                              id="root_items_1__moveUp"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move up"
-                                              type="button"
+                                            <div
+                                              class="ant-space-compact css-dev-only-do-not-override-ac2jek"
+                                              style="width: 100%;"
                                             >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-up"
+                                                id="root_items_1__moveUp"
+                                                style="padding-top: 4px;"
+                                                title="Move up"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-up"
-                                                  className="anticon anticon-arrow-up"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-up"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-up"
+                                                    class="anticon anticon-arrow-up"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-up"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M868 545.5L536.1 163a31.96 31.96 0 00-48.3 0L156 545.5a7.97 7.97 0 006 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
-                                            <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
-                                              disabled={true}
-                                              id="root_items_1__moveDown"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Move down"
-                                              type="button"
-                                            >
-                                              <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-default ant-btn-color-default ant-btn-variant-outlined ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-move-down"
+                                                disabled=""
+                                                id="root_items_1__moveDown"
+                                                style="padding-top: 4px;"
+                                                title="Move down"
+                                                type="button"
                                               >
                                                 <span
-                                                  aria-label="arrow-down"
-                                                  className="anticon anticon-arrow-down"
-                                                  role="img"
+                                                  class="ant-btn-icon"
                                                 >
-                                                  <svg
-                                                    aria-hidden="true"
-                                                    data-icon="arrow-down"
-                                                    fill="currentColor"
-                                                    focusable="false"
-                                                    height="1em"
-                                                    viewBox="64 64 896 896"
-                                                    width="1em"
+                                                  <span
+                                                    aria-label="arrow-down"
+                                                    class="anticon anticon-arrow-down"
+                                                    role="img"
                                                   >
-                                                    <path
-                                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                                    />
-                                                  </svg>
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="arrow-down"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0048.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                                      />
+                                                    </svg>
+                                                  </span>
                                                 </span>
-                                              </span>
-                                            </button>
+                                              </button>
+                                              <button
+                                                class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
+                                                id="root_items_1__remove"
+                                                style="padding-top: 4px;"
+                                                title="Remove"
+                                                type="button"
+                                              >
+                                                <span
+                                                  class="ant-btn-icon"
+                                                >
+                                                  <span
+                                                    aria-label="delete"
+                                                    class="anticon anticon-delete"
+                                                    role="img"
+                                                  >
+                                                    <svg
+                                                      aria-hidden="true"
+                                                      data-icon="delete"
+                                                      fill="currentColor"
+                                                      focusable="false"
+                                                      height="1em"
+                                                      viewBox="64 64 896 896"
+                                                      width="1em"
+                                                    >
+                                                      <path
+                                                        d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      />
+                                                    </svg>
+                                                  </span>
+                                                </span>
+                                              </button>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                      <div
+                                        class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                                        style="padding-left: 12px; padding-right: 12px;"
+                                      >
+                                        <div
+                                          class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                                          style="margin-left: -12px; margin-right: -12px;"
+                                        >
+                                          <div
+                                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
+                                          >
                                             <button
-                                              className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-compact-item ant-btn-compact-first-item ant-btn-compact-last-item rjsf-array-item-remove"
-                                              disabled={false}
-                                              id="root_items_1__remove"
-                                              onClick={[Function]}
-                                              style={
-                                                {
-                                                  "paddingTop": "4px",
-                                                }
-                                              }
-                                              title="Remove"
+                                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-array-item-add"
+                                              id="root_items__add"
+                                              style="padding-top: 4px;"
+                                              title="Add Item"
                                               type="button"
                                             >
                                               <span
-                                                className="ant-btn-icon"
-                                                style={{}}
+                                                class="ant-btn-icon"
                                               >
                                                 <span
-                                                  aria-label="delete"
-                                                  className="anticon anticon-delete"
+                                                  aria-label="plus-circle"
+                                                  class="anticon anticon-plus-circle"
                                                   role="img"
                                                 >
                                                   <svg
                                                     aria-hidden="true"
-                                                    data-icon="delete"
+                                                    data-icon="plus-circle"
                                                     fill="currentColor"
                                                     focusable="false"
                                                     height="1em"
@@ -3689,7 +2686,10 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                                     width="1em"
                                                   >
                                                     <path
-                                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                                      d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                                    />
+                                                    <path
+                                                      d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
                                                     />
                                                   </svg>
                                                 </span>
@@ -3699,81 +2699,8 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                         </div>
                                       </div>
                                     </div>
-                                    <div
-                                      className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                                      style={
-                                        {
-                                          "paddingLeft": 12,
-                                          "paddingRight": 12,
-                                        }
-                                      }
-                                    >
-                                      <div
-                                        className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                                        style={
-                                          {
-                                            "marginLeft": -12,
-                                            "marginRight": -12,
-                                            "rowGap": undefined,
-                                          }
-                                        }
-                                      >
-                                        <div
-                                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                                          style={
-                                            {
-                                              "flex": "0 0 192px",
-                                              "paddingLeft": 12,
-                                              "paddingRight": 12,
-                                            }
-                                          }
-                                        >
-                                          <button
-                                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-array-item-add"
-                                            disabled={false}
-                                            id="root_items__add"
-                                            onClick={[Function]}
-                                            style={
-                                              {
-                                                "paddingTop": "4px",
-                                              }
-                                            }
-                                            title="Add Item"
-                                            type="button"
-                                          >
-                                            <span
-                                              className="ant-btn-icon"
-                                              style={{}}
-                                            >
-                                              <span
-                                                aria-label="plus-circle"
-                                                className="anticon anticon-plus-circle"
-                                                role="img"
-                                              >
-                                                <svg
-                                                  aria-hidden="true"
-                                                  data-icon="plus-circle"
-                                                  fill="currentColor"
-                                                  focusable="false"
-                                                  height="1em"
-                                                  viewBox="64 64 896 896"
-                                                  width="1em"
-                                                >
-                                                  <path
-                                                    d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                                                  />
-                                                  <path
-                                                    d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                                                  />
-                                                </svg>
-                                              </span>
-                                            </span>
-                                          </button>
-                                        </div>
-                                      </div>
-                                    </div>
-                                  </div>
-                                </fieldset>
+                                  </fieldset>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -3781,388 +2708,288 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_firstName"
-                              title="firstName"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              firstName
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_firstName"
+                                title="firstName"
+                              >
+                                firstName
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_firstName"
-                                    name="root.firstName"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_firstName"
+                                      name="root.firstName"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
-                      </div>
-                    </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      </div>
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_lastName"
-                              title="lastName"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              lastName
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_lastName"
+                                title="lastName"
+                              >
+                                lastName
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_lastName"
-                                    name="root.lastName"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_lastName"
+                                      name="root.lastName"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_age"
-                              title="age"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              age
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_age"
+                                title="age"
+                              >
+                                age
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_age__error root_age__description root_age__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_age"
-                                        name="root.age"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_age__error root_age__description root_age__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_age"
+                                          name="root.age"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
                             </div>
@@ -4171,673 +2998,487 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_foo-key"
-                                    title="foo Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    foo Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_foo-key"
+                                      title="foo Key"
+                                    >
+                                      foo Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_foo-key"
-                                          name="root_foo-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="foo"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_foo-key"
+                                            name="root_foo-key"
+                                            type="text"
+                                            value="foo"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_foo"
-                                  title="foo"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  foo
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_foo"
+                                    title="foo"
+                                  >
+                                    foo
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_foo"
-                                        name="root_foo"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="foo"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_foo"
+                                          name="root_foo"
+                                          placeholder=""
+                                          type="text"
+                                          value="foo"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_foo__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_foo__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_a"
-                              title="A"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              A
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_a"
+                                title="A"
+                              >
+                                A
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_a__error root_a__description root_a__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_a"
-                                    name="root_a"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_a__error root_a__description root_a__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_a"
+                                      name="root_a"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_b"
-                              title="B"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              B
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_b"
+                                title="B"
+                              >
+                                B
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_b__error root_b__description root_b__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_b"
-                                        name="root_b"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_b__error root_b__description root_b__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_b"
+                                          name="root_b"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
                             </div>
@@ -4846,1545 +3487,1103 @@ exports[`object fields object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_additionalProperty-key"
-                                    title="additionalProperty Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    additionalProperty Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_additionalProperty-key"
+                                      title="additionalProperty Key"
+                                    >
+                                      additionalProperty Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_additionalProperty-key"
-                                          name="root_additionalProperty-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="additionalProperty"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_additionalProperty-key"
+                                            name="root_additionalProperty-key"
+                                            type="text"
+                                            value="additionalProperty"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_additionalProperty"
-                                  title="additionalProperty"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  additionalProperty
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_additionalProperty"
+                                    title="additionalProperty"
+                                  >
+                                    additionalProperty
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_additionalProperty"
-                                        name="root_additionalProperty"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="should appear"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_additionalProperty"
+                                          name="root_additionalProperty"
+                                          placeholder=""
+                                          type="text"
+                                          value="should appear"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_additionalProperty__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_additionalProperty__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="Test field"
-                    >
-                      Test field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="Test field"
+                      >
+                        Test field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_foo-key"
-                                    title="foo Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    foo Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_foo-key"
+                                      title="foo Key"
+                                    >
+                                      foo Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_foo-key"
-                                          name="root_foo-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="foo"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_foo-key"
+                                            name="root_foo-key"
+                                            type="text"
+                                            value="foo"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_foo"
-                                  title="foo"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  foo
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_foo"
+                                    title="foo"
+                                  >
+                                    foo
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_foo"
-                                        name="root_foo"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="foo"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_foo"
+                                          name="root_foo"
+                                          placeholder=""
+                                          type="text"
+                                          value="foo"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_foo__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_foo__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="My Field"
-                    >
-                      My Field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="My Field"
+                      >
+                        My Field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_foo-key"
-                                    title="foo Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    foo Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_foo-key"
+                                      title="foo Key"
+                                    >
+                                      foo Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_foo-key"
-                                          name="root_foo-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="foo"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_foo-key"
+                                            name="root_foo-key"
+                                            type="text"
+                                            value="foo"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_foo"
-                                  title="foo"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  foo
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_foo"
+                                    title="foo"
+                                  >
+                                    foo
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_foo"
-                                        name="root_foo"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="foo"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_foo"
+                                          name="root_foo"
+                                          placeholder=""
+                                          type="text"
+                                          value="foo"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_foo__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_foo__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a fancier description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a fancier description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="My Field"
-                    >
-                      My Field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="My Field"
+                      >
+                        My Field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_a"
-                              title="My Item A"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              My Item A
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_a"
+                                title="My Item A"
+                              >
+                                My Item A
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_a__error root_a__description root_a__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_a"
-                                    name="root_a"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_a__error root_a__description root_a__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_a"
+                                      name="root_a"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_a__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  a fancier item A description
-                                </span>
+                                  <span
+                                    id="root_a__description"
+                                  >
+                                    a fancier item A description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_b"
-                              title="My Item B"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              My Item B
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_b"
+                                title="My Item B"
+                              >
+                                My Item B
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_b__error root_b__description root_b__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_b"
-                                        name="root_b"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_b__error root_b__description root_b__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_b"
+                                          name="root_b"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_b__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  a fancier item B description
-                                </span>
+                                  <span
+                                    id="root_b__description"
+                                  >
+                                    a fancier item B description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -6392,784 +4591,574 @@ exports[`object fields with title and description from both object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a fancier description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a fancier description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="My Field"
-                    >
-                      My Field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="My Field"
+                      >
+                        My Field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_foo-key"
-                                    title="foo Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    foo Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_foo-key"
+                                      title="foo Key"
+                                    >
+                                      foo Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_foo-key"
-                                          name="root_foo-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="foo"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_foo-key"
+                                            name="root_foo-key"
+                                            type="text"
+                                            value="foo"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_foo"
-                                  title="foo"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  foo
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_foo"
+                                    title="foo"
+                                  >
+                                    foo
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_foo"
-                                        name="root_foo"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="foo"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_foo"
+                                          name="root_foo"
+                                          placeholder=""
+                                          type="text"
+                                          value="foo"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_foo__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_foo__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a fancier description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a fancier description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="My Field"
-                    >
-                      My Field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="My Field"
+                      >
+                        My Field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_a"
-                              title="My Item A"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              My Item A
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_a"
+                                title="My Item A"
+                              >
+                                My Item A
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_a__error root_a__description root_a__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_a"
-                                    name="root_a"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_a__error root_a__description root_a__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_a"
+                                      name="root_a"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_a__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  a fancier item A description
-                                </span>
+                                  <span
+                                    id="root_a__description"
+                                  >
+                                    a fancier item A description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_b"
-                              title="My Item B"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              My Item B
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_b"
+                                title="My Item B"
+                              >
+                                My Item B
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_b__error root_b__description root_b__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_b"
-                                        name="root_b"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_b__error root_b__description root_b__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_b"
+                                          name="root_b"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_b__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  a fancier item B description
-                                </span>
+                                  <span
+                                    id="root_b__description"
+                                  >
+                                    a fancier item B description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -7177,784 +5166,574 @@ exports[`object fields with title and description from uiSchema object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a fancier description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a fancier description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="My Field"
-                    >
-                      My Field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="My Field"
+                      >
+                        My Field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_additionalProperty-key"
-                                    title="additionalProperty Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    additionalProperty Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_additionalProperty-key"
+                                      title="additionalProperty Key"
+                                    >
+                                      additionalProperty Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_additionalProperty-key"
-                                          name="root_additionalProperty-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="additionalProperty"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_additionalProperty-key"
+                                            name="root_additionalProperty-key"
+                                            type="text"
+                                            value="additionalProperty"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_additionalProperty"
-                                  title="additionalProperty"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  additionalProperty
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_additionalProperty"
+                                    title="additionalProperty"
+                                  >
+                                    additionalProperty
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_additionalProperty"
-                                        name="root_additionalProperty"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="should appear"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_additionalProperty"
+                                          name="root_additionalProperty"
+                                          placeholder=""
+                                          type="text"
+                                          value="should appear"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_additionalProperty__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_additionalProperty__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a fancier description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a fancier description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="Test field"
-                    >
-                      Test field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="Test field"
+                      >
+                        Test field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_a"
-                              title="A"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              A
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_a"
+                                title="A"
+                              >
+                                A
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_a__error root_a__description root_a__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_a"
-                                    name="root_a"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_a__error root_a__description root_a__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_a"
+                                      name="root_a"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_a__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  A description
-                                </span>
+                                  <span
+                                    id="root_a__description"
+                                  >
+                                    A description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
-                            <label
-                              className=""
-                              htmlFor="root_b"
-                              title="B"
+                            <div
+                              class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                             >
-                              B
-                            </label>
-                          </div>
-                          <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
-                          >
+                              <label
+                                class=""
+                                for="root_b"
+                                title="B"
+                              >
+                                B
+                              </label>
+                            </div>
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_b__error root_b__description root_b__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_b"
-                                        name="root_b"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_b__error root_b__description root_b__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_b"
+                                          name="root_b"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_b__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  B description
-                                </span>
+                                  <span
+                                    id="root_b__description"
+                                  >
+                                    B description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -7962,1102 +5741,793 @@ exports[`object fields with title and description object 1`] = `
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
-                    <label
-                      className=""
-                      htmlFor="root__title"
-                      onClick={[Function]}
-                      title="Test field"
-                    >
-                      Test field
-                    </label>
                     <div
-                      className="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
-                      role="separator"
-                      style={
-                        {
-                          "marginBlock": "1px",
-                        }
-                      }
-                    />
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
+                      class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
+                    >
+                      <label
+                        class=""
+                        for="root__title"
+                        title="Test field"
+                      >
+                        Test field
+                      </label>
+                      <div
+                        class="ant-divider css-dev-only-do-not-override-ac2jek ant-divider-horizontal ant-divider-sm"
+                        role="separator"
+                        style="margin-block: 1px;"
+                      />
+                    </div>
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_additionalProperty-key"
-                                    title="additionalProperty Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    additionalProperty Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_additionalProperty-key"
+                                      title="additionalProperty Key"
+                                    >
+                                      additionalProperty Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_additionalProperty-key"
-                                          name="root_additionalProperty-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="additionalProperty"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_additionalProperty-key"
+                                            name="root_additionalProperty-key"
+                                            type="text"
+                                            value="additionalProperty"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
-                                <label
-                                  className=""
-                                  htmlFor="root_additionalProperty"
-                                  title="additionalProperty"
+                                <div
+                                  class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                 >
-                                  additionalProperty
-                                </label>
-                              </div>
-                              <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
-                              >
+                                  <label
+                                    class=""
+                                    for="root_additionalProperty"
+                                    title="additionalProperty"
+                                  >
+                                    additionalProperty
+                                  </label>
+                                </div>
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_additionalProperty"
-                                        name="root_additionalProperty"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="should appear"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_additionalProperty"
+                                          name="root_additionalProperty"
+                                          placeholder=""
+                                          type="text"
+                                          value="should appear"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_additionalProperty__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_additionalProperty__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_foo-key"
-                                    title="foo Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    foo Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_foo-key"
+                                      title="foo Key"
+                                    >
+                                      foo Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_foo-key"
-                                          name="root_foo-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="foo"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_foo-key"
+                                            name="root_foo-key"
+                                            type="text"
+                                            value="foo"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_foo"
-                                        name="root_foo"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="foo"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_foo"
+                                          name="root_foo"
+                                          placeholder=""
+                                          type="text"
+                                          value="foo"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_foo__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_foo__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
-                                <span
-                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                <div
+                                  class="ant-form-item-control-input-content"
                                 >
-                                  <input
-                                    aria-describedby="root_a__error root_a__description root_a__help"
-                                    className="ant-input css-dev-only-do-not-override-ac2jek"
-                                    disabled={false}
-                                    id="root_a"
-                                    name="root_a"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
-                                    placeholder=""
-                                    type="text"
-                                    value=""
-                                  />
                                   <span
-                                    className="ant-input-suffix"
-                                  />
-                                </span>
+                                    class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                    style="width: 100%;"
+                                  >
+                                    <input
+                                      aria-describedby="root_a__error root_a__description root_a__help"
+                                      class="ant-input css-dev-only-do-not-override-ac2jek"
+                                      id="root_a"
+                                      name="root_a"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <span
+                                      class="ant-input-suffix"
+                                    />
+                                  </span>
+                                </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_a__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  A description
-                                </span>
+                                  <span
+                                    id="root_a__description"
+                                  >
+                                    A description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
-                  >
                     <div
-                      className="rjsf-field rjsf-field-number"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                        class="rjsf-field rjsf-field-number"
                       >
                         <div
-                          className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "rowGap": undefined,
-                            }
-                          }
+                          class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                         >
                           <div
-                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                            style={{}}
+                            class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                           >
                             <div
-                              className="ant-form-item-control-input"
+                              class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                             >
                               <div
-                                className="ant-form-item-control-input-content"
+                                class="ant-form-item-control-input"
                               >
                                 <div
-                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
-                                  onClick={[Function]}
-                                  style={
-                                    {
-                                      "width": "100%",
-                                    }
-                                  }
+                                  class="ant-form-item-control-input-content"
                                 >
                                   <div
-                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
-                                    onBeforeInput={[Function]}
-                                    onBlur={[Function]}
-                                    onCompositionEnd={[Function]}
-                                    onCompositionStart={[Function]}
-                                    onFocus={[Function]}
-                                    onKeyDown={[Function]}
-                                    onKeyUp={[Function]}
+                                    class="ant-input-number-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-number-outlined ant-input-number-has-feedback"
+                                    style="width: 100%;"
                                   >
                                     <div
-                                      className="ant-input-number-handler-wrap"
+                                      class="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-ac2jek"
                                     >
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Increase Value"
-                                        className="ant-input-number-handler ant-input-number-handler-up"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
+                                      <div
+                                        class="ant-input-number-handler-wrap"
                                       >
                                         <span
-                                          aria-label="up"
-                                          className="anticon anticon-up ant-input-number-handler-up-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Increase Value"
+                                          class="ant-input-number-handler ant-input-number-handler-up"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="up"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="up"
+                                            class="anticon anticon-up ant-input-number-handler-up-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="up"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M890.5 755.3L537.9 269.2c-12.8-17.6-39-17.6-51.7 0L133.5 755.3A8 8 0 00140 768h75c5.1 0 9.9-2.5 12.9-6.6L512 369.8l284.1 391.6c3 4.1 7.8 6.6 12.9 6.6h75c6.5 0 10.3-7.4 6.5-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                      <span
-                                        aria-disabled={false}
-                                        aria-label="Decrease Value"
-                                        className="ant-input-number-handler ant-input-number-handler-down"
-                                        onMouseDown={[Function]}
-                                        onMouseLeave={[Function]}
-                                        onMouseUp={[Function]}
-                                        role="button"
-                                        unselectable="on"
-                                      >
                                         <span
-                                          aria-label="down"
-                                          className="anticon anticon-down ant-input-number-handler-down-inner"
-                                          role="img"
+                                          aria-disabled="false"
+                                          aria-label="Decrease Value"
+                                          class="ant-input-number-handler ant-input-number-handler-down"
+                                          role="button"
+                                          unselectable="on"
                                         >
-                                          <svg
-                                            aria-hidden="true"
-                                            data-icon="down"
-                                            fill="currentColor"
-                                            focusable="false"
-                                            height="1em"
-                                            viewBox="64 64 896 896"
-                                            width="1em"
+                                          <span
+                                            aria-label="down"
+                                            class="anticon anticon-down ant-input-number-handler-down-inner"
+                                            role="img"
                                           >
-                                            <path
-                                              d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
-                                            />
-                                          </svg>
+                                            <svg
+                                              aria-hidden="true"
+                                              data-icon="down"
+                                              fill="currentColor"
+                                              focusable="false"
+                                              height="1em"
+                                              viewBox="64 64 896 896"
+                                              width="1em"
+                                            >
+                                              <path
+                                                d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
+                                              />
+                                            </svg>
+                                          </span>
                                         </span>
-                                      </span>
-                                    </div>
-                                    <div
-                                      className="ant-input-number-input-wrap"
-                                    >
-                                      <input
-                                        aria-describedby="root_b__error root_b__description root_b__help"
-                                        aria-valuenow={null}
-                                        autoComplete="off"
-                                        className="ant-input-number-input"
-                                        disabled={false}
-                                        id="root_b"
-                                        name="root_b"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        role="spinbutton"
-                                        step={1}
-                                        type="number"
-                                        value=""
-                                      />
+                                      </div>
+                                      <div
+                                        class="ant-input-number-input-wrap"
+                                      >
+                                        <input
+                                          aria-describedby="root_b__error root_b__description root_b__help"
+                                          autocomplete="off"
+                                          class="ant-input-number-input"
+                                          id="root_b"
+                                          name="root_b"
+                                          placeholder=""
+                                          role="spinbutton"
+                                          step="1"
+                                          type="number"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
+                                    <span
+                                      class="ant-input-number-suffix"
+                                    />
                                   </div>
-                                  <span
-                                    className="ant-input-number-suffix"
-                                  />
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="ant-form-item-additional"
-                              style={{}}
-                            >
                               <div
-                                className="ant-form-item-extra"
+                                class="ant-form-item-additional"
                               >
-                                <span
-                                  id="root_b__description"
+                                <div
+                                  class="ant-form-item-extra"
                                 >
-                                  B description
-                                </span>
+                                  <span
+                                    id="root_b__description"
+                                  >
+                                    B description
+                                  </span>
+                                </div>
                               </div>
                             </div>
                           </div>
@@ -9065,407 +6535,292 @@ exports[`object fields with title and description with global label off object 1
                       </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-        style={
-          {
-            "rowGap": undefined,
-          }
-        }
+        class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
       >
         <div
-          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-          style={{}}
+          class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
         >
           <div
-            className="ant-form-item-control-input"
+            class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
           >
             <div
-              className="ant-form-item-control-input-content"
+              class="ant-form-item-control-input"
             >
-              <fieldset
-                id="root"
+              <div
+                class="ant-form-item-control-input-content"
               >
-                <div
-                  className="ant-row css-dev-only-do-not-override-ac2jek"
-                  style={
-                    {
-                      "marginLeft": -12,
-                      "marginRight": -12,
-                      "rowGap": undefined,
-                    }
-                  }
+                <fieldset
+                  id="root"
                 >
                   <div
-                    className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "paddingLeft": 12,
-                        "paddingRight": 12,
-                      }
-                    }
+                    class="ant-row css-dev-only-do-not-override-ac2jek"
+                    style="margin-left: -12px; margin-right: -12px;"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
+                      style="padding-left: 12px; padding-right: 12px;"
                     >
                       <div
-                        className="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
-                        style={
-                          {
-                            "marginLeft": -12,
-                            "marginRight": -12,
-                            "rowGap": undefined,
-                          }
-                        }
+                        class="rjsf-field rjsf-field-string"
                       >
                         <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
+                          class="ant-row ant-row-top css-dev-only-do-not-override-ac2jek"
+                          style="margin-left: -12px; margin-right: -12px;"
                         >
                           <div
-                            className="form-group"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                              class="form-group"
                             >
                               <div
-                                className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                                style={
-                                  {
-                                    "rowGap": undefined,
-                                  }
-                                }
+                                class="ant-form-item form-group css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                               >
                                 <div
-                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
+                                  class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                                 >
-                                  <label
-                                    className=""
-                                    htmlFor="root_additionalProperty-key"
-                                    title="additionalProperty Key"
+                                  <div
+                                    class="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-ac2jek"
                                   >
-                                    additionalProperty Key
-                                  </label>
-                                </div>
-                                <div
-                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                  style={{}}
-                                >
+                                    <label
+                                      class=""
+                                      for="root_additionalProperty-key"
+                                      title="additionalProperty Key"
+                                    >
+                                      additionalProperty Key
+                                    </label>
+                                  </div>
                                   <div
-                                    className="ant-form-item-control-input"
+                                    class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                   >
                                     <div
-                                      className="ant-form-item-control-input-content"
+                                      class="ant-form-item-control-input"
                                     >
-                                      <span
-                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
-                                        onClick={[Function]}
-                                        style={
-                                          {
-                                            "width": "100%",
-                                          }
-                                        }
+                                      <div
+                                        class="ant-form-item-control-input-content"
                                       >
-                                        <input
-                                          className="ant-input css-dev-only-do-not-override-ac2jek"
-                                          disabled={false}
-                                          id="root_additionalProperty-key"
-                                          name="root_additionalProperty-key"
-                                          onBlur={[Function]}
-                                          onChange={[Function]}
-                                          onCompositionEnd={[Function]}
-                                          onCompositionStart={[Function]}
-                                          onFocus={[Function]}
-                                          onKeyDown={[Function]}
-                                          onKeyUp={[Function]}
-                                          type="text"
-                                          value="additionalProperty"
-                                        />
                                         <span
-                                          className="ant-input-suffix"
-                                        />
-                                      </span>
+                                          class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined form-control"
+                                          style="width: 100%;"
+                                        >
+                                          <input
+                                            class="ant-input css-dev-only-do-not-override-ac2jek"
+                                            id="root_additionalProperty-key"
+                                            name="root_additionalProperty-key"
+                                            type="text"
+                                            value="additionalProperty"
+                                          />
+                                          <span
+                                            class="ant-input-suffix"
+                                          />
+                                        </span>
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col form-additional css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "1",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
                           <div
-                            className="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
+                            class="ant-col form-additional css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 1 1 0%;"
                           >
                             <div
-                              className="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
-                              style={
-                                {
-                                  "rowGap": undefined,
-                                }
-                              }
+                              class="ant-form-item css-dev-only-do-not-override-ac2jek ant-form-item-horizontal"
                             >
                               <div
-                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
-                                style={{}}
+                                class="ant-row ant-form-item-row css-dev-only-do-not-override-ac2jek"
                               >
                                 <div
-                                  className="ant-form-item-control-input"
+                                  class="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-ac2jek"
                                 >
                                   <div
-                                    className="ant-form-item-control-input-content"
+                                    class="ant-form-item-control-input"
                                   >
-                                    <span
-                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
-                                      onClick={[Function]}
-                                      style={
-                                        {
-                                          "width": "100%",
-                                        }
-                                      }
+                                    <div
+                                      class="ant-form-item-control-input-content"
                                     >
-                                      <input
-                                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                                        className="ant-input css-dev-only-do-not-override-ac2jek"
-                                        disabled={false}
-                                        id="root_additionalProperty"
-                                        name="root_additionalProperty"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onCompositionEnd={[Function]}
-                                        onCompositionStart={[Function]}
-                                        onFocus={[Function]}
-                                        onKeyDown={[Function]}
-                                        onKeyUp={[Function]}
-                                        placeholder=""
-                                        type="text"
-                                        value="should appear"
-                                      />
                                       <span
-                                        className="ant-input-suffix"
-                                      />
-                                    </span>
+                                        class="ant-input-affix-wrapper css-dev-only-do-not-override-ac2jek ant-input-outlined"
+                                        style="width: 100%;"
+                                      >
+                                        <input
+                                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                                          class="ant-input css-dev-only-do-not-override-ac2jek"
+                                          id="root_additionalProperty"
+                                          name="root_additionalProperty"
+                                          placeholder=""
+                                          type="text"
+                                          value="should appear"
+                                        />
+                                        <span
+                                          class="ant-input-suffix"
+                                        />
+                                      </span>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="ant-col css-dev-only-do-not-override-ac2jek"
-                          style={
-                            {
-                              "flex": "0 0 192px",
-                              "paddingLeft": 12,
-                              "paddingRight": 12,
-                            }
-                          }
-                        >
-                          <button
-                            className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
-                            disabled={false}
-                            id="root_additionalProperty__remove"
-                            onClick={[Function]}
-                            style={
-                              {
-                                "paddingTop": "4px",
-                              }
-                            }
-                            title="Remove"
-                            type="button"
+                          <div
+                            class="ant-col css-dev-only-do-not-override-ac2jek"
+                            style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                           >
-                            <span
-                              className="ant-btn-icon"
-                              style={{}}
+                            <button
+                              class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-dangerous ant-btn-color-dangerous ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-remove"
+                              id="root_additionalProperty__remove"
+                              style="padding-top: 4px;"
+                              title="Remove"
+                              type="button"
                             >
                               <span
-                                aria-label="delete"
-                                className="anticon anticon-delete"
-                                role="img"
+                                class="ant-btn-icon"
                               >
-                                <svg
-                                  aria-hidden="true"
-                                  data-icon="delete"
-                                  fill="currentColor"
-                                  focusable="false"
-                                  height="1em"
-                                  viewBox="64 64 896 896"
-                                  width="1em"
+                                <span
+                                  aria-label="delete"
+                                  class="anticon anticon-delete"
+                                  role="img"
                                 >
-                                  <path
-                                    d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
-                                  />
-                                </svg>
+                                  <svg
+                                    aria-hidden="true"
+                                    data-icon="delete"
+                                    fill="currentColor"
+                                    focusable="false"
+                                    height="1em"
+                                    viewBox="64 64 896 896"
+                                    width="1em"
+                                  >
+                                    <path
+                                      d="M360 184h-8c4.4 0 8-3.6 8-8v8h304v-8c0 4.4 3.6 8 8 8h-8v72h72v-80c0-35.3-28.7-64-64-64H352c-35.3 0-64 28.7-64 64v80h72v-72zm504 72H160c-17.7 0-32 14.3-32 32v32c0 4.4 3.6 8 8 8h60.4l24.7 523c1.6 34.1 29.8 61 63.9 61h454c34.2 0 62.3-26.8 63.9-61l24.7-523H888c4.4 0 8-3.6 8-8v-32c0-17.7-14.3-32-32-32zM731.3 840H292.7l-24.2-512h487l-24.2 512z"
+                                    />
+                                  </svg>
+                                </span>
                               </span>
-                            </span>
-                          </button>
+                            </button>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
-                  style={{}}
-                >
                   <div
-                    className="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
-                    style={
-                      {
-                        "marginLeft": -12,
-                        "marginRight": -12,
-                        "rowGap": undefined,
-                      }
-                    }
+                    class="ant-col ant-col-24 css-dev-only-do-not-override-ac2jek"
                   >
                     <div
-                      className="ant-col css-dev-only-do-not-override-ac2jek"
-                      style={
-                        {
-                          "flex": "0 0 192px",
-                          "paddingLeft": 12,
-                          "paddingRight": 12,
-                        }
-                      }
+                      class="ant-row ant-row-end css-dev-only-do-not-override-ac2jek"
+                      style="margin-left: -12px; margin-right: -12px;"
                     >
-                      <button
-                        className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
-                        disabled={false}
-                        id="root__add"
-                        onClick={[Function]}
-                        style={
-                          {
-                            "paddingTop": "4px",
-                          }
-                        }
-                        title="Add Item"
-                        type="button"
+                      <div
+                        class="ant-col css-dev-only-do-not-override-ac2jek"
+                        style="padding-left: 12px; padding-right: 12px; flex: 0 0 192px;"
                       >
-                        <span
-                          className="ant-btn-icon"
-                          style={{}}
+                        <button
+                          class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-primary ant-btn-color-primary ant-btn-variant-solid ant-btn-icon-only ant-btn-block rjsf-object-property-expand"
+                          id="root__add"
+                          style="padding-top: 4px;"
+                          title="Add Item"
+                          type="button"
                         >
                           <span
-                            aria-label="plus-circle"
-                            className="anticon anticon-plus-circle"
-                            role="img"
+                            class="ant-btn-icon"
                           >
-                            <svg
-                              aria-hidden="true"
-                              data-icon="plus-circle"
-                              fill="currentColor"
-                              focusable="false"
-                              height="1em"
-                              viewBox="64 64 896 896"
-                              width="1em"
+                            <span
+                              aria-label="plus-circle"
+                              class="anticon anticon-plus-circle"
+                              role="img"
                             >
-                              <path
-                                d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
-                              />
-                              <path
-                                d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
-                              />
-                            </svg>
+                              <svg
+                                aria-hidden="true"
+                                data-icon="plus-circle"
+                                fill="currentColor"
+                                focusable="false"
+                                height="1em"
+                                viewBox="64 64 896 896"
+                                width="1em"
+                              >
+                                <path
+                                  d="M696 480H544V328c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v152H328c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h152v152c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V544h152c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8z"
+                                />
+                                <path
+                                  d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
+                                />
+                              </svg>
+                            </span>
                           </span>
-                        </span>
-                      </button>
+                        </button>
+                      </div>
                     </div>
                   </div>
-                </div>
-              </fieldset>
+                </fieldset>
+              </div>
             </div>
-          </div>
-          <div
-            className="ant-form-item-additional"
-            style={{}}
-          >
             <div
-              className="ant-form-item-extra"
+              class="ant-form-item-additional"
             >
-              <span
-                id="root__description"
+              <div
+                class="ant-form-item-extra"
               >
-                a test description
-              </span>
+                <span
+                  id="root__description"
+                >
+                  a test description
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
-    disabled={false}
-    onClick={[Function]}
-    style={{}}
-    type="submit"
-  >
-    <span>
-      Submit
-    </span>
-  </button>
-</form>
+    <button
+      class="ant-btn css-dev-only-do-not-override-ac2jek ant-btn-submit"
+      type="submit"
+    >
+      <span>
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap b/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
index adb10e5f4e..437b03baf9 100644
--- a/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -248,103 +248,91 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r24:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-object"
+                class="rjsf-field rjsf-field-object"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r25:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_person__title"
                     >
                       <h5
-                        className="chakra-heading emotion-6"
+                        class="chakra-heading emotion-6"
                       >
                         person
                       </h5>
                       <span
                         aria-orientation="horizontal"
-                        className="chakra-separator emotion-7"
+                        class="chakra-separator emotion-7"
                         role="separator"
                       />
                     </div>
                     <div
-                      className="emotion-2"
+                      class="emotion-2"
                     >
                       <div>
                         <div
-                          className="rjsf-field rjsf-field-string"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <fieldset
                             aria-labelledby="fieldset:::r26:::legend"
-                            className="fieldset__root emotion-0"
+                            class="fieldset__root emotion-0"
                             data-part="root"
                             data-scope="fieldset"
-                            disabled={false}
                           >
                             <div
-                              className="fieldset__content emotion-1"
+                              class="fieldset__content emotion-1"
                             >
                               <div
-                                className="chakra-field__root emotion-11"
+                                class="chakra-field__root emotion-11"
                                 data-part="root"
                                 data-scope="field"
                                 id="field:::r27:"
                                 role="group"
                               >
                                 <label
-                                  className="chakra-field__label emotion-12"
+                                  class="chakra-field__label emotion-12"
                                   data-part="label"
                                   data-scope="field"
-                                  htmlFor=":r27:"
+                                  for=":r27:"
                                   id="field:::r27:::label"
                                 >
                                   name
                                 </label>
                                 <input
                                   aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                                  autoFocus={false}
-                                  className="chakra-input emotion-13"
+                                  class="chakra-input emotion-13"
                                   data-part="input"
                                   data-scope="field"
-                                  disabled={false}
                                   id="root_person_name"
                                   name="root[person][name]"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
                                   placeholder=""
-                                  readOnly={false}
-                                  required={false}
                                   type="text"
                                   value=""
                                 />
@@ -355,81 +343,72 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                       </div>
                       <div>
                         <div
-                          className="rjsf-field rjsf-field-object"
+                          class="rjsf-field rjsf-field-object"
                         >
                           <fieldset
                             aria-labelledby="fieldset:::r28:::legend"
-                            className="fieldset__root emotion-0"
+                            class="fieldset__root emotion-0"
                             data-part="root"
                             data-scope="fieldset"
-                            disabled={false}
                           >
                             <div
-                              className="fieldset__content emotion-1"
+                              class="fieldset__content emotion-1"
                             >
                               <div
-                                className="emotion-5"
+                                class="emotion-5"
                                 id="root_person_address__title"
                               >
                                 <h5
-                                  className="chakra-heading emotion-6"
+                                  class="chakra-heading emotion-6"
                                 >
                                   address
                                 </h5>
                                 <span
                                   aria-orientation="horizontal"
-                                  className="chakra-separator emotion-7"
+                                  class="chakra-separator emotion-7"
                                   role="separator"
                                 />
                               </div>
                               <div
-                                className="emotion-2"
+                                class="emotion-2"
                               >
                                 <div>
                                   <div
-                                    className="rjsf-field rjsf-field-string"
+                                    class="rjsf-field rjsf-field-string"
                                   >
                                     <fieldset
                                       aria-labelledby="fieldset:::r29:::legend"
-                                      className="fieldset__root emotion-0"
+                                      class="fieldset__root emotion-0"
                                       data-part="root"
                                       data-scope="fieldset"
-                                      disabled={false}
                                     >
                                       <div
-                                        className="fieldset__content emotion-1"
+                                        class="fieldset__content emotion-1"
                                       >
                                         <div
-                                          className="chakra-field__root emotion-11"
+                                          class="chakra-field__root emotion-11"
                                           data-part="root"
                                           data-scope="field"
                                           id="field:::r2a:"
                                           role="group"
                                         >
                                           <label
-                                            className="chakra-field__label emotion-12"
+                                            class="chakra-field__label emotion-12"
                                             data-part="label"
                                             data-scope="field"
-                                            htmlFor=":r2a:"
+                                            for=":r2a:"
                                             id="field:::r2a:::label"
                                           >
                                             street
                                           </label>
                                           <input
                                             aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                            autoFocus={false}
-                                            className="chakra-input emotion-13"
+                                            class="chakra-input emotion-13"
                                             data-part="input"
                                             data-scope="field"
-                                            disabled={false}
                                             id="root_person_address_street"
                                             name="root[person][address][street]"
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
                                             placeholder=""
-                                            readOnly={false}
-                                            required={false}
                                             type="text"
                                             value=""
                                           />
@@ -440,49 +419,41 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                                 </div>
                                 <div>
                                   <div
-                                    className="rjsf-field rjsf-field-string"
+                                    class="rjsf-field rjsf-field-string"
                                   >
                                     <fieldset
                                       aria-labelledby="fieldset:::r2b:::legend"
-                                      className="fieldset__root emotion-0"
+                                      class="fieldset__root emotion-0"
                                       data-part="root"
                                       data-scope="fieldset"
-                                      disabled={false}
                                     >
                                       <div
-                                        className="fieldset__content emotion-1"
+                                        class="fieldset__content emotion-1"
                                       >
                                         <div
-                                          className="chakra-field__root emotion-11"
+                                          class="chakra-field__root emotion-11"
                                           data-part="root"
                                           data-scope="field"
                                           id="field:::r2c:"
                                           role="group"
                                         >
                                           <label
-                                            className="chakra-field__label emotion-12"
+                                            class="chakra-field__label emotion-12"
                                             data-part="label"
                                             data-scope="field"
-                                            htmlFor=":r2c:"
+                                            for=":r2c:"
                                             id="field:::r2c:::label"
                                           >
                                             city
                                           </label>
                                           <input
                                             aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                            autoFocus={false}
-                                            className="chakra-input emotion-13"
+                                            class="chakra-input emotion-13"
                                             data-part="input"
                                             data-scope="field"
-                                            disabled={false}
                                             id="root_person_address_city"
                                             name="root[person][address][city]"
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
                                             placeholder=""
-                                            readOnly={false}
-                                            required={false}
                                             type="text"
                                             value=""
                                           />
@@ -493,49 +464,41 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
                                 </div>
                                 <div>
                                   <div
-                                    className="rjsf-field rjsf-field-string"
+                                    class="rjsf-field rjsf-field-string"
                                   >
                                     <fieldset
                                       aria-labelledby="fieldset:::r2d:::legend"
-                                      className="fieldset__root emotion-0"
+                                      class="fieldset__root emotion-0"
                                       data-part="root"
                                       data-scope="fieldset"
-                                      disabled={false}
                                     >
                                       <div
-                                        className="fieldset__content emotion-1"
+                                        class="fieldset__content emotion-1"
                                       >
                                         <div
-                                          className="chakra-field__root emotion-11"
+                                          class="chakra-field__root emotion-11"
                                           data-part="root"
                                           data-scope="field"
                                           id="field:::r2e:"
                                           role="group"
                                         >
                                           <label
-                                            className="chakra-field__label emotion-12"
+                                            class="chakra-field__label emotion-12"
                                             data-part="label"
                                             data-scope="field"
-                                            htmlFor=":r2e:"
+                                            for=":r2e:"
                                             id="field:::r2e:::label"
                                           >
                                             country
                                           </label>
                                           <input
                                             aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                            autoFocus={false}
-                                            className="chakra-input emotion-13"
+                                            class="chakra-input emotion-13"
                                             data-part="input"
                                             data-scope="field"
-                                            disabled={false}
                                             id="root_person_address_country"
                                             name="root[person][address][country]"
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
                                             placeholder=""
-                                            readOnly={false}
-                                            required={false}
                                             type="text"
                                             value=""
                                           />
@@ -559,25 +522,24 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-35"
+      class="emotion-35"
     >
       <button
-        className="chakra-button emotion-36"
-        disabled={false}
+        class="chakra-button emotion-36"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -974,71 +936,60 @@ exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`]
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r2f:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r2g:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r2h:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r2h:"
+                        for=":r2h:"
                         id="field:::r2h:::label"
                       >
                         name
                       </label>
                       <input
                         aria-describedby="root_name__error root_name__description root_name__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_name"
                         name="root[name]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value="John"
                       />
@@ -1049,82 +1000,70 @@ exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`]
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-8"
+                class="rjsf-field rjsf-field-string emotion-8"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-9"
+                    class="chakra-field__root emotion-9"
                     data-part="root"
                     data-scope="field"
                     id="field:::r2i:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-6"
+                      class="chakra-field__label emotion-6"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r2i:"
+                      for=":r2i:"
                       id="field:::r2i:::label"
                     >
                       customField Key
                     </label>
                     <input
-                      className="chakra-input emotion-11"
+                      class="chakra-input emotion-11"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="customField"
-                      disabled={false}
                       id="root_customField-key"
                       name="root_customField-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="customField"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r2j:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-5"
+                        class="chakra-field__root emotion-5"
                         data-part="root"
                         data-scope="field"
                         id="field:::r2k:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-6"
+                          class="chakra-field__label emotion-6"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":r2k:"
+                          for=":r2k:"
                           id="field:::r2k:::label"
                         >
                           customField
                         </label>
                         <input
                           aria-describedby="root_customField__error root_customField__description root_customField__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-7"
+                          class="chakra-input emotion-7"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_customField"
                           name="root[customField]"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="customValue"
                         />
@@ -1135,24 +1074,22 @@ exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`]
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-17"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-17"
                     id="root_customField__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -1170,26 +1107,24 @@ exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`]
               </div>
             </div>
             <div
-              className="emotion-18"
+              class="emotion-18"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-19"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-19"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -1207,25 +1142,24 @@ exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`]
       </fieldset>
     </div>
     <div
-      className="emotion-20"
+      class="emotion-20"
     >
       <button
-        className="chakra-button emotion-19"
-        disabled={false}
+        class="chakra-button emotion-19"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -1768,71 +1702,60 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r2l:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r2m:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r2n:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r2n:"
+                        for=":r2n:"
                         id="field:::r2n:::label"
                       >
                         name
                       </label>
                       <input
                         aria-describedby="root_name__error root_name__description root_name__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_name"
                         name="root[name]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value="Alice"
                       />
@@ -1843,52 +1766,44 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r2o:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r2p:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r2p:"
+                        for=":r2p:"
                         id="field:::r2p:::label"
                       >
                         age
                       </label>
                       <input
                         aria-describedby="root_age__error root_age__description root_age__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_age"
                         name="root[age]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
-                        value={30}
+                        value="30"
                       />
                     </div>
                   </div>
@@ -1897,20 +1812,19 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-boolean"
+                class="rjsf-field rjsf-field-boolean"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r2q:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r2r:"
@@ -1918,50 +1832,27 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                     >
                       <label
                         aria-describedby="root_active__error root_active__description root_active__help"
-                        className="chakra-checkbox__root emotion-16"
+                        class="chakra-checkbox__root emotion-16"
                         data-part="root"
                         data-scope="checkbox"
                         data-state="checked"
                         dir="ltr"
-                        htmlFor=":r2r:"
+                        for=":r2r:"
                         id="checkbox:root_active"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onFocus={[Function]}
-                        onPointerLeave={[Function]}
-                        onPointerMove={[Function]}
                       >
                         <input
-                          aria-invalid={false}
+                          aria-invalid="false"
                           aria-labelledby="field:::r2r:::label"
-                          defaultChecked={true}
-                          disabled={false}
+                          checked=""
                           id=":r2r:"
                           name="root[active]"
-                          onBlur={[Function]}
-                          onClick={[Function]}
-                          onFocus={[Function]}
-                          required={false}
-                          style={
-                            {
-                              "border": "0",
-                              "clip": "rect(0 0 0 0)",
-                              "height": "1px",
-                              "margin": "-1px",
-                              "overflow": "hidden",
-                              "padding": "0",
-                              "position": "absolute",
-                              "whiteSpace": "nowrap",
-                              "width": "1px",
-                              "wordWrap": "normal",
-                            }
-                          }
+                          style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: absolute; width: 1px; white-space: nowrap; word-wrap: normal;"
                           type="checkbox"
                           value="on"
                         />
                         <div
-                          aria-hidden={true}
-                          className="chakra-checkbox__control emotion-17"
+                          aria-hidden="true"
+                          class="chakra-checkbox__control emotion-17"
                           data-part="control"
                           data-scope="checkbox"
                           data-state="checked"
@@ -1969,7 +1860,7 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                           id="checkbox:root_active:control"
                         >
                           <svg
-                            className="emotion-18"
+                            class="emotion-18"
                             data-state="checked"
                             viewBox="0 0 24 24"
                           >
@@ -1979,7 +1870,7 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                           </svg>
                         </div>
                         <span
-                          className="chakra-checkbox__label emotion-19"
+                          class="chakra-checkbox__label emotion-19"
                           data-part="label"
                           data-scope="checkbox"
                           data-state="checked"
@@ -1998,96 +1889,88 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-array"
+                class="rjsf-field rjsf-field-array"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r2t:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div>
                       <div
-                        className="emotion-22"
+                        class="emotion-22"
                         id="root_tags__title"
                       >
                         <h5
-                          className="chakra-heading emotion-23"
+                          class="chakra-heading emotion-23"
                         >
                           tags
                         </h5>
                         <span
                           aria-orientation="horizontal"
-                          className="chakra-separator emotion-24"
+                          class="chakra-separator emotion-24"
                           role="separator"
                         />
                       </div>
                       <div
-                        className="emotion-25"
+                        class="emotion-25"
                       >
                         <div>
                           <div
-                            className="chakra-stack emotion-26"
+                            class="chakra-stack emotion-26"
                           >
                             <div
-                              className="emotion-27"
+                              class="emotion-27"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <fieldset
                                   aria-labelledby="fieldset:::r2u:::legend"
-                                  className="fieldset__root emotion-0"
+                                  class="fieldset__root emotion-0"
                                   data-part="root"
                                   data-scope="fieldset"
-                                  disabled={false}
                                 >
                                   <div
-                                    className="fieldset__content emotion-1"
+                                    class="fieldset__content emotion-1"
                                   >
                                     <div
-                                      className="chakra-field__root emotion-5"
+                                      class="chakra-field__root emotion-5"
                                       data-part="root"
                                       data-scope="field"
                                       id="field:::r2v:"
                                       role="group"
                                     >
                                       <label
-                                        className="chakra-field__label emotion-6"
+                                        class="chakra-field__label emotion-6"
                                         data-part="label"
                                         data-required=""
                                         data-scope="field"
-                                        htmlFor=":r2v:"
+                                        for=":r2v:"
                                         id="field:::r2v:::label"
                                       >
                                         tags-0
                                         <span
                                           aria-hidden="true"
-                                          className="chakra-field__requiredIndicator emotion-32"
+                                          class="chakra-field__requiredIndicator emotion-32"
                                         >
                                           *
                                         </span>
                                       </label>
                                       <input
                                         aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                        autoFocus={false}
-                                        className="chakra-input emotion-7"
+                                        class="chakra-input emotion-7"
                                         data-part="input"
                                         data-required=""
                                         data-scope="field"
-                                        disabled={false}
                                         id="root_tags_0"
                                         name="root[tags][0]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
                                         placeholder=""
-                                        readOnly={false}
-                                        required={true}
+                                        required=""
                                         type="text"
                                         value="developer"
                                       />
@@ -2098,28 +1981,27 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                             </div>
                             <div>
                               <div
-                                className="chakra-group emotion-34"
+                                class="chakra-group emotion-34"
                               >
                                 <button
                                   aria-label="Move up"
-                                  className="chakra-button rjsf-array-item-move-up emotion-35"
-                                  disabled={true}
+                                  class="chakra-button rjsf-array-item-move-up emotion-35"
+                                  disabled=""
                                   id="root_tags_0__moveUp"
-                                  onClick={[Function]}
                                   title="Move up"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-up"
+                                    class="lucide lucide-arrow-up"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2132,24 +2014,22 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Move down"
-                                  className="chakra-button rjsf-array-item-move-down emotion-35"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-move-down emotion-35"
                                   id="root_tags_0__moveDown"
-                                  onClick={[Function]}
                                   title="Move down"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-down"
+                                    class="lucide lucide-arrow-down"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2162,24 +2042,22 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Remove"
-                                  className="chakra-button rjsf-array-item-remove emotion-35"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-remove emotion-35"
                                   id="root_tags_0__remove"
-                                  onClick={[Function]}
                                   title="Remove"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-delete"
+                                    class="lucide lucide-delete"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2197,63 +2075,56 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                             </div>
                           </div>
                           <div
-                            className="chakra-stack emotion-26"
+                            class="chakra-stack emotion-26"
                           >
                             <div
-                              className="emotion-27"
+                              class="emotion-27"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <fieldset
                                   aria-labelledby="fieldset:::r30:::legend"
-                                  className="fieldset__root emotion-0"
+                                  class="fieldset__root emotion-0"
                                   data-part="root"
                                   data-scope="fieldset"
-                                  disabled={false}
                                 >
                                   <div
-                                    className="fieldset__content emotion-1"
+                                    class="fieldset__content emotion-1"
                                   >
                                     <div
-                                      className="chakra-field__root emotion-5"
+                                      class="chakra-field__root emotion-5"
                                       data-part="root"
                                       data-scope="field"
                                       id="field:::r31:"
                                       role="group"
                                     >
                                       <label
-                                        className="chakra-field__label emotion-6"
+                                        class="chakra-field__label emotion-6"
                                         data-part="label"
                                         data-required=""
                                         data-scope="field"
-                                        htmlFor=":r31:"
+                                        for=":r31:"
                                         id="field:::r31:::label"
                                       >
                                         tags-1
                                         <span
                                           aria-hidden="true"
-                                          className="chakra-field__requiredIndicator emotion-32"
+                                          class="chakra-field__requiredIndicator emotion-32"
                                         >
                                           *
                                         </span>
                                       </label>
                                       <input
                                         aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                        autoFocus={false}
-                                        className="chakra-input emotion-7"
+                                        class="chakra-input emotion-7"
                                         data-part="input"
                                         data-required=""
                                         data-scope="field"
-                                        disabled={false}
                                         id="root_tags_1"
                                         name="root[tags][1]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
                                         placeholder=""
-                                        readOnly={false}
-                                        required={true}
+                                        required=""
                                         type="text"
                                         value="designer"
                                       />
@@ -2264,28 +2135,26 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                             </div>
                             <div>
                               <div
-                                className="chakra-group emotion-34"
+                                class="chakra-group emotion-34"
                               >
                                 <button
                                   aria-label="Move up"
-                                  className="chakra-button rjsf-array-item-move-up emotion-35"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-move-up emotion-35"
                                   id="root_tags_1__moveUp"
-                                  onClick={[Function]}
                                   title="Move up"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-up"
+                                    class="lucide lucide-arrow-up"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2298,24 +2167,23 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Move down"
-                                  className="chakra-button rjsf-array-item-move-down emotion-35"
-                                  disabled={true}
+                                  class="chakra-button rjsf-array-item-move-down emotion-35"
+                                  disabled=""
                                   id="root_tags_1__moveDown"
-                                  onClick={[Function]}
                                   title="Move down"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-down"
+                                    class="lucide lucide-arrow-down"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2328,24 +2196,22 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Remove"
-                                  className="chakra-button rjsf-array-item-remove emotion-35"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-remove emotion-35"
                                   id="root_tags_1__remove"
-                                  onClick={[Function]}
                                   title="Remove"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-delete"
+                                    class="lucide lucide-delete"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -2364,29 +2230,27 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                           </div>
                         </div>
                         <div
-                          className="emotion-50"
+                          class="emotion-50"
                         >
                           <div
-                            className="emotion-51"
+                            class="emotion-51"
                           >
                             <button
-                              className="chakra-button rjsf-array-item-add emotion-52"
-                              disabled={false}
+                              class="chakra-button rjsf-array-item-add emotion-52"
                               id="root_tags__add"
-                              onClick={[Function]}
                               type="button"
                             >
                               <svg
                                 aria-hidden="true"
-                                className="lucide lucide-plus"
+                                class="lucide lucide-plus"
                                 fill="none"
-                                height={24}
+                                height="24"
                                 stroke="currentColor"
-                                strokeLinecap="round"
-                                strokeLinejoin="round"
-                                strokeWidth={2}
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                                stroke-width="2"
                                 viewBox="0 0 24 24"
-                                width={24}
+                                width="24"
                                 xmlns="http://www.w3.org/2000/svg"
                               >
                                 <path
@@ -2411,25 +2275,24 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-53"
+      class="emotion-53"
     >
       <button
-        className="chakra-button emotion-52"
-        disabled={false}
+        class="chakra-button emotion-52"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -2652,71 +2515,60 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r1t:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r1u:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r1v:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r1v:"
+                        for=":r1v:"
                         id="field:::r1v:::label"
                       >
                         firstName
                       </label>
                       <input
                         aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_firstName"
                         name="root[firstName]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -2727,49 +2579,41 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r20:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r21:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r21:"
+                        for=":r21:"
                         id="field:::r21:::label"
                       >
                         lastName
                       </label>
                       <input
                         aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_lastName"
                         name="root[lastName]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -2780,49 +2624,41 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r22:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r23:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r23:"
+                        for=":r23:"
                         id="field:::r23:::label"
                       >
                         age
                       </label>
                       <input
                         aria-describedby="root_age__error root_age__description root_age__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_age"
                         name="root[age]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -2837,25 +2673,24 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-18"
+      class="emotion-18"
     >
       <button
-        className="chakra-button emotion-19"
-        disabled={false}
+        class="chakra-button emotion-19"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -3102,103 +2937,91 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r39:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-object"
+                class="rjsf-field rjsf-field-object"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r3a:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_person__title"
                     >
                       <h5
-                        className="chakra-heading emotion-6"
+                        class="chakra-heading emotion-6"
                       >
                         person
                       </h5>
                       <span
                         aria-orientation="horizontal"
-                        className="chakra-separator emotion-7"
+                        class="chakra-separator emotion-7"
                         role="separator"
                       />
                     </div>
                     <div
-                      className="emotion-2"
+                      class="emotion-2"
                     >
                       <div>
                         <div
-                          className="rjsf-field rjsf-field-string"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <fieldset
                             aria-labelledby="fieldset:::r3b:::legend"
-                            className="fieldset__root emotion-0"
+                            class="fieldset__root emotion-0"
                             data-part="root"
                             data-scope="fieldset"
-                            disabled={false}
                           >
                             <div
-                              className="fieldset__content emotion-1"
+                              class="fieldset__content emotion-1"
                             >
                               <div
-                                className="chakra-field__root emotion-11"
+                                class="chakra-field__root emotion-11"
                                 data-part="root"
                                 data-scope="field"
                                 id="field:::r3c:"
                                 role="group"
                               >
                                 <label
-                                  className="chakra-field__label emotion-12"
+                                  class="chakra-field__label emotion-12"
                                   data-part="label"
                                   data-scope="field"
-                                  htmlFor=":r3c:"
+                                  for=":r3c:"
                                   id="field:::r3c:::label"
                                 >
                                   name
                                 </label>
                                 <input
                                   aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                                  autoFocus={false}
-                                  className="chakra-input emotion-13"
+                                  class="chakra-input emotion-13"
                                   data-part="input"
                                   data-scope="field"
-                                  disabled={false}
                                   id="root_person_name"
                                   name="root.person.name"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
                                   placeholder=""
-                                  readOnly={false}
-                                  required={false}
                                   type="text"
                                   value=""
                                 />
@@ -3209,81 +3032,72 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
                       </div>
                       <div>
                         <div
-                          className="rjsf-field rjsf-field-object"
+                          class="rjsf-field rjsf-field-object"
                         >
                           <fieldset
                             aria-labelledby="fieldset:::r3d:::legend"
-                            className="fieldset__root emotion-0"
+                            class="fieldset__root emotion-0"
                             data-part="root"
                             data-scope="fieldset"
-                            disabled={false}
                           >
                             <div
-                              className="fieldset__content emotion-1"
+                              class="fieldset__content emotion-1"
                             >
                               <div
-                                className="emotion-5"
+                                class="emotion-5"
                                 id="root_person_address__title"
                               >
                                 <h5
-                                  className="chakra-heading emotion-6"
+                                  class="chakra-heading emotion-6"
                                 >
                                   address
                                 </h5>
                                 <span
                                   aria-orientation="horizontal"
-                                  className="chakra-separator emotion-7"
+                                  class="chakra-separator emotion-7"
                                   role="separator"
                                 />
                               </div>
                               <div
-                                className="emotion-2"
+                                class="emotion-2"
                               >
                                 <div>
                                   <div
-                                    className="rjsf-field rjsf-field-string"
+                                    class="rjsf-field rjsf-field-string"
                                   >
                                     <fieldset
                                       aria-labelledby="fieldset:::r3e:::legend"
-                                      className="fieldset__root emotion-0"
+                                      class="fieldset__root emotion-0"
                                       data-part="root"
                                       data-scope="fieldset"
-                                      disabled={false}
                                     >
                                       <div
-                                        className="fieldset__content emotion-1"
+                                        class="fieldset__content emotion-1"
                                       >
                                         <div
-                                          className="chakra-field__root emotion-11"
+                                          class="chakra-field__root emotion-11"
                                           data-part="root"
                                           data-scope="field"
                                           id="field:::r3f:"
                                           role="group"
                                         >
                                           <label
-                                            className="chakra-field__label emotion-12"
+                                            class="chakra-field__label emotion-12"
                                             data-part="label"
                                             data-scope="field"
-                                            htmlFor=":r3f:"
+                                            for=":r3f:"
                                             id="field:::r3f:::label"
                                           >
                                             street
                                           </label>
                                           <input
                                             aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                            autoFocus={false}
-                                            className="chakra-input emotion-13"
+                                            class="chakra-input emotion-13"
                                             data-part="input"
                                             data-scope="field"
-                                            disabled={false}
                                             id="root_person_address_street"
                                             name="root.person.address.street"
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
                                             placeholder=""
-                                            readOnly={false}
-                                            required={false}
                                             type="text"
                                             value=""
                                           />
@@ -3294,49 +3108,41 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
                                 </div>
                                 <div>
                                   <div
-                                    className="rjsf-field rjsf-field-string"
+                                    class="rjsf-field rjsf-field-string"
                                   >
                                     <fieldset
                                       aria-labelledby="fieldset:::r3g:::legend"
-                                      className="fieldset__root emotion-0"
+                                      class="fieldset__root emotion-0"
                                       data-part="root"
                                       data-scope="fieldset"
-                                      disabled={false}
                                     >
                                       <div
-                                        className="fieldset__content emotion-1"
+                                        class="fieldset__content emotion-1"
                                       >
                                         <div
-                                          className="chakra-field__root emotion-11"
+                                          class="chakra-field__root emotion-11"
                                           data-part="root"
                                           data-scope="field"
                                           id="field:::r3h:"
                                           role="group"
                                         >
                                           <label
-                                            className="chakra-field__label emotion-12"
+                                            class="chakra-field__label emotion-12"
                                             data-part="label"
                                             data-scope="field"
-                                            htmlFor=":r3h:"
+                                            for=":r3h:"
                                             id="field:::r3h:::label"
                                           >
                                             city
                                           </label>
                                           <input
                                             aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                            autoFocus={false}
-                                            className="chakra-input emotion-13"
+                                            class="chakra-input emotion-13"
                                             data-part="input"
                                             data-scope="field"
-                                            disabled={false}
                                             id="root_person_address_city"
                                             name="root.person.address.city"
-                                            onBlur={[Function]}
-                                            onChange={[Function]}
-                                            onFocus={[Function]}
                                             placeholder=""
-                                            readOnly={false}
-                                            required={false}
                                             type="text"
                                             value=""
                                           />
@@ -3360,25 +3166,24 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-30"
+      class="emotion-30"
     >
       <button
-        className="chakra-button emotion-31"
-        disabled={false}
+        class="chakra-button emotion-31"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -3806,71 +3611,60 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r3i:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r3j:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r3k:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r3k:"
+                        for=":r3k:"
                         id="field:::r3k:::label"
                       >
                         name
                       </label>
                       <input
                         aria-describedby="root_name__error root_name__description root_name__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_name"
                         name="root.name"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value="Test"
                       />
@@ -3881,52 +3675,44 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r3l:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r3m:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r3m:"
+                        for=":r3m:"
                         id="field:::r3m:::label"
                       >
                         count
                       </label>
                       <input
                         aria-describedby="root_count__error root_count__description root_count__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_count"
                         name="root.count"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
-                        value={5}
+                        value="5"
                       />
                     </div>
                   </div>
@@ -3935,96 +3721,88 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-array"
+                class="rjsf-field rjsf-field-array"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r3n:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div>
                       <div
-                        className="emotion-15"
+                        class="emotion-15"
                         id="root_items__title"
                       >
                         <h5
-                          className="chakra-heading emotion-16"
+                          class="chakra-heading emotion-16"
                         >
                           items
                         </h5>
                         <span
                           aria-orientation="horizontal"
-                          className="chakra-separator emotion-17"
+                          class="chakra-separator emotion-17"
                           role="separator"
                         />
                       </div>
                       <div
-                        className="emotion-18"
+                        class="emotion-18"
                       >
                         <div>
                           <div
-                            className="chakra-stack emotion-19"
+                            class="chakra-stack emotion-19"
                           >
                             <div
-                              className="emotion-20"
+                              class="emotion-20"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <fieldset
                                   aria-labelledby="fieldset:::r3o:::legend"
-                                  className="fieldset__root emotion-0"
+                                  class="fieldset__root emotion-0"
                                   data-part="root"
                                   data-scope="fieldset"
-                                  disabled={false}
                                 >
                                   <div
-                                    className="fieldset__content emotion-1"
+                                    class="fieldset__content emotion-1"
                                   >
                                     <div
-                                      className="chakra-field__root emotion-5"
+                                      class="chakra-field__root emotion-5"
                                       data-part="root"
                                       data-scope="field"
                                       id="field:::r3p:"
                                       role="group"
                                     >
                                       <label
-                                        className="chakra-field__label emotion-6"
+                                        class="chakra-field__label emotion-6"
                                         data-part="label"
                                         data-required=""
                                         data-scope="field"
-                                        htmlFor=":r3p:"
+                                        for=":r3p:"
                                         id="field:::r3p:::label"
                                       >
                                         items-0
                                         <span
                                           aria-hidden="true"
-                                          className="chakra-field__requiredIndicator emotion-25"
+                                          class="chakra-field__requiredIndicator emotion-25"
                                         >
                                           *
                                         </span>
                                       </label>
                                       <input
                                         aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                        autoFocus={false}
-                                        className="chakra-input emotion-7"
+                                        class="chakra-input emotion-7"
                                         data-part="input"
                                         data-required=""
                                         data-scope="field"
-                                        disabled={false}
                                         id="root_items_0"
                                         name="root.items.0"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
                                         placeholder=""
-                                        readOnly={false}
-                                        required={true}
+                                        required=""
                                         type="text"
                                         value="a"
                                       />
@@ -4035,28 +3813,27 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                             </div>
                             <div>
                               <div
-                                className="chakra-group emotion-27"
+                                class="chakra-group emotion-27"
                               >
                                 <button
                                   aria-label="Move up"
-                                  className="chakra-button rjsf-array-item-move-up emotion-28"
-                                  disabled={true}
+                                  class="chakra-button rjsf-array-item-move-up emotion-28"
+                                  disabled=""
                                   id="root_items_0__moveUp"
-                                  onClick={[Function]}
                                   title="Move up"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-up"
+                                    class="lucide lucide-arrow-up"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4069,24 +3846,22 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Move down"
-                                  className="chakra-button rjsf-array-item-move-down emotion-28"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-move-down emotion-28"
                                   id="root_items_0__moveDown"
-                                  onClick={[Function]}
                                   title="Move down"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-down"
+                                    class="lucide lucide-arrow-down"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4099,24 +3874,22 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Remove"
-                                  className="chakra-button rjsf-array-item-remove emotion-28"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-remove emotion-28"
                                   id="root_items_0__remove"
-                                  onClick={[Function]}
                                   title="Remove"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-delete"
+                                    class="lucide lucide-delete"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4134,63 +3907,56 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                             </div>
                           </div>
                           <div
-                            className="chakra-stack emotion-19"
+                            class="chakra-stack emotion-19"
                           >
                             <div
-                              className="emotion-20"
+                              class="emotion-20"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <fieldset
                                   aria-labelledby="fieldset:::r3q:::legend"
-                                  className="fieldset__root emotion-0"
+                                  class="fieldset__root emotion-0"
                                   data-part="root"
                                   data-scope="fieldset"
-                                  disabled={false}
                                 >
                                   <div
-                                    className="fieldset__content emotion-1"
+                                    class="fieldset__content emotion-1"
                                   >
                                     <div
-                                      className="chakra-field__root emotion-5"
+                                      class="chakra-field__root emotion-5"
                                       data-part="root"
                                       data-scope="field"
                                       id="field:::r3r:"
                                       role="group"
                                     >
                                       <label
-                                        className="chakra-field__label emotion-6"
+                                        class="chakra-field__label emotion-6"
                                         data-part="label"
                                         data-required=""
                                         data-scope="field"
-                                        htmlFor=":r3r:"
+                                        for=":r3r:"
                                         id="field:::r3r:::label"
                                       >
                                         items-1
                                         <span
                                           aria-hidden="true"
-                                          className="chakra-field__requiredIndicator emotion-25"
+                                          class="chakra-field__requiredIndicator emotion-25"
                                         >
                                           *
                                         </span>
                                       </label>
                                       <input
                                         aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                        autoFocus={false}
-                                        className="chakra-input emotion-7"
+                                        class="chakra-input emotion-7"
                                         data-part="input"
                                         data-required=""
                                         data-scope="field"
-                                        disabled={false}
                                         id="root_items_1"
                                         name="root.items.1"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
                                         placeholder=""
-                                        readOnly={false}
-                                        required={true}
+                                        required=""
                                         type="text"
                                         value="b"
                                       />
@@ -4201,28 +3967,26 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                             </div>
                             <div>
                               <div
-                                className="chakra-group emotion-27"
+                                class="chakra-group emotion-27"
                               >
                                 <button
                                   aria-label="Move up"
-                                  className="chakra-button rjsf-array-item-move-up emotion-28"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-move-up emotion-28"
                                   id="root_items_1__moveUp"
-                                  onClick={[Function]}
                                   title="Move up"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-up"
+                                    class="lucide lucide-arrow-up"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4235,24 +3999,23 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Move down"
-                                  className="chakra-button rjsf-array-item-move-down emotion-28"
-                                  disabled={true}
+                                  class="chakra-button rjsf-array-item-move-down emotion-28"
+                                  disabled=""
                                   id="root_items_1__moveDown"
-                                  onClick={[Function]}
                                   title="Move down"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-arrow-down"
+                                    class="lucide lucide-arrow-down"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4265,24 +4028,22 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                                 </button>
                                 <button
                                   aria-label="Remove"
-                                  className="chakra-button rjsf-array-item-remove emotion-28"
-                                  disabled={false}
+                                  class="chakra-button rjsf-array-item-remove emotion-28"
                                   id="root_items_1__remove"
-                                  onClick={[Function]}
                                   title="Remove"
                                   type="button"
                                 >
                                   <svg
                                     aria-hidden="true"
-                                    className="lucide lucide-delete"
+                                    class="lucide lucide-delete"
                                     fill="none"
-                                    height={24}
+                                    height="24"
                                     stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
+                                    stroke-linecap="round"
+                                    stroke-linejoin="round"
+                                    stroke-width="2"
                                     viewBox="0 0 24 24"
-                                    width={24}
+                                    width="24"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
@@ -4301,29 +4062,27 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                           </div>
                         </div>
                         <div
-                          className="emotion-43"
+                          class="emotion-43"
                         >
                           <div
-                            className="emotion-44"
+                            class="emotion-44"
                           >
                             <button
-                              className="chakra-button rjsf-array-item-add emotion-45"
-                              disabled={false}
+                              class="chakra-button rjsf-array-item-add emotion-45"
                               id="root_items__add"
-                              onClick={[Function]}
                               type="button"
                             >
                               <svg
                                 aria-hidden="true"
-                                className="lucide lucide-plus"
+                                class="lucide lucide-plus"
                                 fill="none"
-                                height={24}
+                                height="24"
                                 stroke="currentColor"
-                                strokeLinecap="round"
-                                strokeLinejoin="round"
-                                strokeWidth={2}
+                                stroke-linecap="round"
+                                stroke-linejoin="round"
+                                stroke-width="2"
                                 viewBox="0 0 24 24"
-                                width={24}
+                                width="24"
                                 xmlns="http://www.w3.org/2000/svg"
                               >
                                 <path
@@ -4348,25 +4107,24 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-46"
+      class="emotion-46"
     >
       <button
-        className="chakra-button emotion-45"
-        disabled={false}
+        class="chakra-button emotion-45"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -4589,71 +4347,60 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r32:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r33:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r34:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r34:"
+                        for=":r34:"
                         id="field:::r34:::label"
                       >
                         firstName
                       </label>
                       <input
                         aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_firstName"
                         name="root.firstName"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -4664,49 +4411,41 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r35:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r36:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r36:"
+                        for=":r36:"
                         id="field:::r36:::label"
                       >
                         lastName
                       </label>
                       <input
                         aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_lastName"
                         name="root.lastName"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -4717,49 +4456,41 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r37:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r38:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r38:"
+                        for=":r38:"
                         id="field:::r38:::label"
                       >
                         age
                       </label>
                       <input
                         aria-describedby="root_age__error root_age__description root_age__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_age"
                         name="root.age"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -4774,25 +4505,24 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-18"
+      class="emotion-18"
     >
       <button
-        className="chakra-button emotion-19"
-        disabled={false}
+        class="chakra-button emotion-19"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -5189,104 +4919,89 @@ exports[`object fields additionalProperties 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r5:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-3"
+                class="rjsf-field rjsf-field-string emotion-3"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-4"
+                    class="chakra-field__root emotion-4"
                     data-part="root"
                     data-scope="field"
                     id="field:::r6:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-5"
+                      class="chakra-field__label emotion-5"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r6:"
+                      for=":r6:"
                       id="field:::r6:::label"
                     >
                       foo Key
                     </label>
                     <input
-                      className="chakra-input emotion-6"
+                      class="chakra-input emotion-6"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="foo"
-                      disabled={false}
                       id="root_foo-key"
                       name="root_foo-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="foo"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r7:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-9"
+                        class="chakra-field__root emotion-9"
                         data-part="root"
                         data-scope="field"
                         id="field:::r8:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-5"
+                          class="chakra-field__label emotion-5"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":r8:"
+                          for=":r8:"
                           id="field:::r8:::label"
                         >
                           foo
                         </label>
                         <input
                           aria-describedby="root_foo__error root_foo__description root_foo__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-11"
+                          class="chakra-input emotion-11"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_foo"
                           name="root_foo"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="foo"
                         />
@@ -5297,24 +5012,22 @@ exports[`object fields additionalProperties 1`] = `
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-12"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-12"
                     id="root_foo__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -5332,26 +5045,24 @@ exports[`object fields additionalProperties 1`] = `
               </div>
             </div>
             <div
-              className="emotion-13"
+              class="emotion-13"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-14"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-14"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -5369,25 +5080,24 @@ exports[`object fields additionalProperties 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-15"
+      class="emotion-15"
     >
       <button
-        className="chakra-button emotion-14"
-        disabled={false}
+        class="chakra-button emotion-14"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -5610,71 +5320,60 @@ exports[`object fields object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r0:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r1:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r2:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r2:"
+                        for=":r2:"
                         id="field:::r2:::label"
                       >
                         A
                       </label>
                       <input
                         aria-describedby="root_a__error root_a__description root_a__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_a"
                         name="root_a"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -5685,49 +5384,41 @@ exports[`object fields object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r3:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r4:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-6"
+                        class="chakra-field__label emotion-6"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r4:"
+                        for=":r4:"
                         id="field:::r4:::label"
                       >
                         B
                       </label>
                       <input
                         aria-describedby="root_b__error root_b__description root_b__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-7"
+                        class="chakra-input emotion-7"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_b"
                         name="root_b"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -5742,25 +5433,24 @@ exports[`object fields object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-13"
+      class="emotion-13"
     >
       <button
-        className="chakra-button emotion-14"
-        disabled={false}
+        class="chakra-button emotion-14"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -6157,104 +5847,89 @@ exports[`object fields show add button and fields if additionalProperties is tru
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r9:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-3"
+                class="rjsf-field rjsf-field-string emotion-3"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-4"
+                    class="chakra-field__root emotion-4"
                     data-part="root"
                     data-scope="field"
                     id="field:::ra:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-5"
+                      class="chakra-field__label emotion-5"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":ra:"
+                      for=":ra:"
                       id="field:::ra:::label"
                     >
                       additionalProperty Key
                     </label>
                     <input
-                      className="chakra-input emotion-6"
+                      class="chakra-input emotion-6"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="additionalProperty"
-                      disabled={false}
                       id="root_additionalProperty-key"
                       name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="additionalProperty"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::rb:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-9"
+                        class="chakra-field__root emotion-9"
                         data-part="root"
                         data-scope="field"
                         id="field:::rc:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-5"
+                          class="chakra-field__label emotion-5"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":rc:"
+                          for=":rc:"
                           id="field:::rc:::label"
                         >
                           additionalProperty
                         </label>
                         <input
                           aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-11"
+                          class="chakra-input emotion-11"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_additionalProperty"
                           name="root_additionalProperty"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="should appear"
                         />
@@ -6265,24 +5940,22 @@ exports[`object fields show add button and fields if additionalProperties is tru
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-12"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-12"
                     id="root_additionalProperty__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -6300,26 +5973,24 @@ exports[`object fields show add button and fields if additionalProperties is tru
               </div>
             </div>
             <div
-              className="emotion-13"
+              class="emotion-13"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-14"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-14"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -6337,25 +6008,24 @@ exports[`object fields show add button and fields if additionalProperties is tru
       </fieldset>
     </div>
     <div
-      className="emotion-15"
+      class="emotion-15"
     >
       <button
-        className="chakra-button emotion-14"
-        disabled={false}
+        class="chakra-button emotion-14"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -6780,125 +6450,110 @@ exports[`object fields with title and description additionalProperties 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::ri:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               Test field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a test description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-7"
+                class="rjsf-field rjsf-field-string emotion-7"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-8"
+                    class="chakra-field__root emotion-8"
                     data-part="root"
                     data-scope="field"
                     id="field:::rj:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-9"
+                      class="chakra-field__label emotion-9"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":rj:"
+                      for=":rj:"
                       id="field:::rj:::label"
                     >
                       foo Key
                     </label>
                     <input
-                      className="chakra-input emotion-10"
+                      class="chakra-input emotion-10"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="foo"
-                      disabled={false}
                       id="root_foo-key"
                       name="root_foo-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="foo"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::rk:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-13"
+                        class="chakra-field__root emotion-13"
                         data-part="root"
                         data-scope="field"
                         id="field:::rl:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-9"
+                          class="chakra-field__label emotion-9"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":rl:"
+                          for=":rl:"
                           id="field:::rl:::label"
                         >
                           foo
                         </label>
                         <input
                           aria-describedby="root_foo__error root_foo__description root_foo__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-15"
+                          class="chakra-input emotion-15"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_foo"
                           name="root_foo"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="foo"
                         />
@@ -6909,24 +6564,22 @@ exports[`object fields with title and description additionalProperties 1`] = `
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-16"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-16"
                     id="root_foo__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -6944,26 +6597,24 @@ exports[`object fields with title and description additionalProperties 1`] = `
               </div>
             </div>
             <div
-              className="emotion-17"
+              class="emotion-17"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-18"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-18"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -6981,25 +6632,24 @@ exports[`object fields with title and description additionalProperties 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-19"
+      class="emotion-19"
     >
       <button
-        className="chakra-button emotion-18"
-        disabled={false}
+        class="chakra-button emotion-18"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -7424,125 +7074,110 @@ exports[`object fields with title and description from both additionalProperties
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r1c:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               My Field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a fancier description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-7"
+                class="rjsf-field rjsf-field-string emotion-7"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-8"
+                    class="chakra-field__root emotion-8"
                     data-part="root"
                     data-scope="field"
                     id="field:::r1d:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-9"
+                      class="chakra-field__label emotion-9"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r1d:"
+                      for=":r1d:"
                       id="field:::r1d:::label"
                     >
                       foo Key
                     </label>
                     <input
-                      className="chakra-input emotion-10"
+                      class="chakra-input emotion-10"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="foo"
-                      disabled={false}
                       id="root_foo-key"
                       name="root_foo-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="foo"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r1e:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-13"
+                        class="chakra-field__root emotion-13"
                         data-part="root"
                         data-scope="field"
                         id="field:::r1f:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-9"
+                          class="chakra-field__label emotion-9"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":r1f:"
+                          for=":r1f:"
                           id="field:::r1f:::label"
                         >
                           foo
                         </label>
                         <input
                           aria-describedby="root_foo__error root_foo__description root_foo__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-15"
+                          class="chakra-input emotion-15"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_foo"
                           name="root_foo"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="foo"
                         />
@@ -7553,24 +7188,22 @@ exports[`object fields with title and description from both additionalProperties
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-16"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-16"
                     id="root_foo__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -7588,26 +7221,24 @@ exports[`object fields with title and description from both additionalProperties
               </div>
             </div>
             <div
-              className="emotion-17"
+              class="emotion-17"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-18"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-18"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -7625,25 +7256,24 @@ exports[`object fields with title and description from both additionalProperties
       </fieldset>
     </div>
     <div
-      className="emotion-19"
+      class="emotion-19"
     >
       <button
-        className="chakra-button emotion-18"
-        disabled={false}
+        class="chakra-button emotion-18"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -7911,105 +7541,94 @@ exports[`object fields with title and description from both object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r17:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               My Field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a fancier description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r18:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::r18:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_a__description"
                     >
                       a fancier item A description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::r19:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r19:"
+                        for=":r19:"
                         id="field:::r19:::label"
                       >
                         My Item A
                       </label>
                       <input
                         aria-describedby="root_a__error root_a__description root_a__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_a"
                         name="root_a"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -8020,62 +7639,54 @@ exports[`object fields with title and description from both object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r1a:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::r1a:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_b__description"
                     >
                       a fancier item B description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::r1b:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":r1b:"
+                        for=":r1b:"
                         id="field:::r1b:::label"
                       >
                         My Item B
                       </label>
                       <input
                         aria-describedby="root_b__error root_b__description root_b__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_b"
                         name="root_b"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -8090,25 +7701,24 @@ exports[`object fields with title and description from both object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-21"
+      class="emotion-21"
     >
       <button
-        className="chakra-button emotion-22"
-        disabled={false}
+        class="chakra-button emotion-22"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -8533,125 +8143,110 @@ exports[`object fields with title and description from uiSchema additionalProper
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::rv:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               My Field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a fancier description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-7"
+                class="rjsf-field rjsf-field-string emotion-7"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-8"
+                    class="chakra-field__root emotion-8"
                     data-part="root"
                     data-scope="field"
                     id="field:::r10:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-9"
+                      class="chakra-field__label emotion-9"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r10:"
+                      for=":r10:"
                       id="field:::r10:::label"
                     >
                       foo Key
                     </label>
                     <input
-                      className="chakra-input emotion-10"
+                      class="chakra-input emotion-10"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="foo"
-                      disabled={false}
                       id="root_foo-key"
                       name="root_foo-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="foo"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r11:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-13"
+                        class="chakra-field__root emotion-13"
                         data-part="root"
                         data-scope="field"
                         id="field:::r12:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-9"
+                          class="chakra-field__label emotion-9"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":r12:"
+                          for=":r12:"
                           id="field:::r12:::label"
                         >
                           foo
                         </label>
                         <input
                           aria-describedby="root_foo__error root_foo__description root_foo__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-15"
+                          class="chakra-input emotion-15"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_foo"
                           name="root_foo"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="foo"
                         />
@@ -8662,24 +8257,22 @@ exports[`object fields with title and description from uiSchema additionalProper
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-16"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-16"
                     id="root_foo__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -8697,26 +8290,24 @@ exports[`object fields with title and description from uiSchema additionalProper
               </div>
             </div>
             <div
-              className="emotion-17"
+              class="emotion-17"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-18"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-18"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -8734,25 +8325,24 @@ exports[`object fields with title and description from uiSchema additionalProper
       </fieldset>
     </div>
     <div
-      className="emotion-19"
+      class="emotion-19"
     >
       <button
-        className="chakra-button emotion-18"
-        disabled={false}
+        class="chakra-button emotion-18"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -9020,105 +8610,94 @@ exports[`object fields with title and description from uiSchema object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::rq:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               My Field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a fancier description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::rr:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::rr:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_a__description"
                     >
                       a fancier item A description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::rs:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":rs:"
+                        for=":rs:"
                         id="field:::rs:::label"
                       >
                         My Item A
                       </label>
                       <input
                         aria-describedby="root_a__error root_a__description root_a__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_a"
                         name="root_a"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -9129,62 +8708,54 @@ exports[`object fields with title and description from uiSchema object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::rt:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::rt:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_b__description"
                     >
                       a fancier item B description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::ru:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":ru:"
+                        for=":ru:"
                         id="field:::ru:::label"
                       >
                         My Item B
                       </label>
                       <input
                         aria-describedby="root_b__error root_b__description root_b__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_b"
                         name="root_b"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -9199,25 +8770,24 @@ exports[`object fields with title and description from uiSchema object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-21"
+      class="emotion-21"
     >
       <button
-        className="chakra-button emotion-22"
-        disabled={false}
+        class="chakra-button emotion-22"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -9642,125 +9212,110 @@ exports[`object fields with title and description from uiSchema show add button
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r13:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               My Field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a fancier description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-7"
+                class="rjsf-field rjsf-field-string emotion-7"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-8"
+                    class="chakra-field__root emotion-8"
                     data-part="root"
                     data-scope="field"
                     id="field:::r14:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-9"
+                      class="chakra-field__label emotion-9"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r14:"
+                      for=":r14:"
                       id="field:::r14:::label"
                     >
                       additionalProperty Key
                     </label>
                     <input
-                      className="chakra-input emotion-10"
+                      class="chakra-input emotion-10"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="additionalProperty"
-                      disabled={false}
                       id="root_additionalProperty-key"
                       name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="additionalProperty"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r15:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-13"
+                        class="chakra-field__root emotion-13"
                         data-part="root"
                         data-scope="field"
                         id="field:::r16:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-9"
+                          class="chakra-field__label emotion-9"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":r16:"
+                          for=":r16:"
                           id="field:::r16:::label"
                         >
                           additionalProperty
                         </label>
                         <input
                           aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-15"
+                          class="chakra-input emotion-15"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_additionalProperty"
                           name="root_additionalProperty"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="should appear"
                         />
@@ -9771,24 +9326,22 @@ exports[`object fields with title and description from uiSchema show add button
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-16"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-16"
                     id="root_additionalProperty__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -9806,26 +9359,24 @@ exports[`object fields with title and description from uiSchema show add button
               </div>
             </div>
             <div
-              className="emotion-17"
+              class="emotion-17"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-18"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-18"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -9843,25 +9394,24 @@ exports[`object fields with title and description from uiSchema show add button
       </fieldset>
     </div>
     <div
-      className="emotion-19"
+      class="emotion-19"
     >
       <button
-        className="chakra-button emotion-18"
-        disabled={false}
+        class="chakra-button emotion-18"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -10129,105 +9679,94 @@ exports[`object fields with title and description object 1`] = `
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::rd:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               Test field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a test description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::re:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::re:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_a__description"
                     >
                       A description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::rf:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":rf:"
+                        for=":rf:"
                         id="field:::rf:::label"
                       >
                         A
                       </label>
                       <input
                         aria-describedby="root_a__error root_a__description root_a__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_a"
                         name="root_a"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -10238,62 +9777,54 @@ exports[`object fields with title and description object 1`] = `
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::rg:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <legend
-                    className="fieldset__legend emotion-8"
+                    class="fieldset__legend emotion-8"
                     data-part="legend"
                     data-scope="fieldset"
                     id="fieldset:::rg:::legend"
                   >
                     <sup
-                      className="emotion-5"
+                      class="emotion-5"
                       id="root_b__description"
                     >
                       B description
                     </sup>
                   </legend>
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-11"
+                      class="chakra-field__root emotion-11"
                       data-part="root"
                       data-scope="field"
                       id="field:::rh:"
                       role="group"
                     >
                       <label
-                        className="chakra-field__label emotion-12"
+                        class="chakra-field__label emotion-12"
                         data-part="label"
                         data-scope="field"
-                        htmlFor=":rh:"
+                        for=":rh:"
                         id="field:::rh:::label"
                       >
                         B
                       </label>
                       <input
                         aria-describedby="root_b__error root_b__description root_b__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-13"
+                        class="chakra-input emotion-13"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_b"
                         name="root_b"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -10308,25 +9839,24 @@ exports[`object fields with title and description object 1`] = `
       </fieldset>
     </div>
     <div
-      className="emotion-21"
+      class="emotion-21"
     >
       <button
-        className="chakra-button emotion-22"
-        disabled={false}
+        class="chakra-button emotion-22"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -10751,125 +10281,110 @@ exports[`object fields with title and description show add button and fields if
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::rm:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
             id="root__title"
           >
             <h5
-              className="chakra-heading emotion-3"
+              class="chakra-heading emotion-3"
             >
               Test field
             </h5>
             <span
               aria-orientation="horizontal"
-              className="chakra-separator emotion-4"
+              class="chakra-separator emotion-4"
               role="separator"
             />
           </div>
           <sup
-            className="emotion-5"
+            class="emotion-5"
             id="root__description"
           >
             a test description
           </sup>
           <div
-            className="emotion-6"
+            class="emotion-6"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-7"
+                class="rjsf-field rjsf-field-string emotion-7"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-8"
+                    class="chakra-field__root emotion-8"
                     data-part="root"
                     data-scope="field"
                     id="field:::rn:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-9"
+                      class="chakra-field__label emotion-9"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":rn:"
+                      for=":rn:"
                       id="field:::rn:::label"
                     >
                       additionalProperty Key
                     </label>
                     <input
-                      className="chakra-input emotion-10"
+                      class="chakra-input emotion-10"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="additionalProperty"
-                      disabled={false}
                       id="root_additionalProperty-key"
                       name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="additionalProperty"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::ro:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-13"
+                        class="chakra-field__root emotion-13"
                         data-part="root"
                         data-scope="field"
                         id="field:::rp:"
                         role="group"
                       >
                         <label
-                          className="chakra-field__label emotion-9"
+                          class="chakra-field__label emotion-9"
                           data-part="label"
                           data-scope="field"
-                          htmlFor=":rp:"
+                          for=":rp:"
                           id="field:::rp:::label"
                         >
                           additionalProperty
                         </label>
                         <input
                           aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-15"
+                          class="chakra-input emotion-15"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_additionalProperty"
                           name="root_additionalProperty"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="should appear"
                         />
@@ -10880,24 +10395,22 @@ exports[`object fields with title and description show add button and fields if
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-16"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-16"
                     id="root_additionalProperty__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -10915,26 +10428,24 @@ exports[`object fields with title and description show add button and fields if
               </div>
             </div>
             <div
-              className="emotion-17"
+              class="emotion-17"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-18"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-18"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -10952,25 +10463,24 @@ exports[`object fields with title and description show add button and fields if
       </fieldset>
     </div>
     <div
-      className="emotion-19"
+      class="emotion-19"
     >
       <button
-        className="chakra-button emotion-18"
-        disabled={false}
+        class="chakra-button emotion-18"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -11367,75 +10877,67 @@ exports[`object fields with title and description with global label off addition
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r1l:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-3"
+                class="rjsf-field rjsf-field-string emotion-3"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-4"
+                    class="chakra-field__root emotion-4"
                     data-part="root"
                     data-scope="field"
                     id="field:::r1m:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-5"
+                      class="chakra-field__label emotion-5"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r1m:"
+                      for=":r1m:"
                       id="field:::r1m:::label"
                     >
                       foo Key
                     </label>
                     <input
-                      className="chakra-input emotion-6"
+                      class="chakra-input emotion-6"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="foo"
-                      disabled={false}
                       id="root_foo-key"
                       name="root_foo-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="foo"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r1n:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-9"
+                        class="chakra-field__root emotion-9"
                         data-part="root"
                         data-scope="field"
                         id="field:::r1o:"
@@ -11443,19 +10945,12 @@ exports[`object fields with title and description with global label off addition
                       >
                         <input
                           aria-describedby="root_foo__error root_foo__description root_foo__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-10"
+                          class="chakra-input emotion-10"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_foo"
                           name="root_foo"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="foo"
                         />
@@ -11466,24 +10961,22 @@ exports[`object fields with title and description with global label off addition
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-11"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-11"
                     id="root_foo__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -11501,26 +10994,24 @@ exports[`object fields with title and description with global label off addition
               </div>
             </div>
             <div
-              className="emotion-12"
+              class="emotion-12"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-13"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-13"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -11538,25 +11029,24 @@ exports[`object fields with title and description with global label off addition
       </fieldset>
     </div>
     <div
-      className="emotion-14"
+      class="emotion-14"
     >
       <button
-        className="chakra-button emotion-13"
-        disabled={false}
+        class="chakra-button emotion-13"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -11753,42 +11243,38 @@ exports[`object fields with title and description with global label off object 1
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r1g:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="rjsf-field rjsf-field-string"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r1h:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r1i:"
@@ -11796,19 +11282,12 @@ exports[`object fields with title and description with global label off object 1
                     >
                       <input
                         aria-describedby="root_a__error root_a__description root_a__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-6"
+                        class="chakra-input emotion-6"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_a"
                         name="root_a"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         type="text"
                         value=""
                       />
@@ -11819,20 +11298,19 @@ exports[`object fields with title and description with global label off object 1
             </div>
             <div>
               <div
-                className="rjsf-field rjsf-field-number"
+                class="rjsf-field rjsf-field-number"
               >
                 <fieldset
                   aria-labelledby="fieldset:::r1j:::legend"
-                  className="fieldset__root emotion-0"
+                  class="fieldset__root emotion-0"
                   data-part="root"
                   data-scope="fieldset"
-                  disabled={false}
                 >
                   <div
-                    className="fieldset__content emotion-1"
+                    class="fieldset__content emotion-1"
                   >
                     <div
-                      className="chakra-field__root emotion-5"
+                      class="chakra-field__root emotion-5"
                       data-part="root"
                       data-scope="field"
                       id="field:::r1k:"
@@ -11840,19 +11318,12 @@ exports[`object fields with title and description with global label off object 1
                     >
                       <input
                         aria-describedby="root_b__error root_b__description root_b__help"
-                        autoFocus={false}
-                        className="chakra-input emotion-6"
+                        class="chakra-input emotion-6"
                         data-part="input"
                         data-scope="field"
-                        disabled={false}
                         id="root_b"
                         name="root_b"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
                         placeholder=""
-                        readOnly={false}
-                        required={false}
                         step="any"
                         type="number"
                         value=""
@@ -11867,25 +11338,24 @@ exports[`object fields with title and description with global label off object 1
       </fieldset>
     </div>
     <div
-      className="emotion-11"
+      class="emotion-11"
     >
       <button
-        className="chakra-button emotion-12"
-        disabled={false}
+        class="chakra-button emotion-12"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   @layer recipes {
   .emotion-0 {
     display: -webkit-box;
@@ -12282,75 +11752,67 @@ exports[`object fields with title and description with global label off show add
 }
 
 <form
-    className="rjsf"
-    noValidate={false}
-    onSubmit={[Function]}
+    class="rjsf"
   >
     <div
-      className="rjsf-field rjsf-field-object"
+      class="rjsf-field rjsf-field-object"
     >
       <fieldset
         aria-labelledby="fieldset:::r1p:::legend"
-        className="fieldset__root emotion-0"
+        class="fieldset__root emotion-0"
         data-part="root"
         data-scope="fieldset"
-        disabled={false}
       >
         <div
-          className="fieldset__content emotion-1"
+          class="fieldset__content emotion-1"
         >
           <div
-            className="emotion-2"
+            class="emotion-2"
           >
             <div>
               <div
-                className="rjsf-field rjsf-field-string emotion-3"
+                class="rjsf-field rjsf-field-string emotion-3"
               >
                 <div>
                   <div
-                    className="chakra-field__root emotion-4"
+                    class="chakra-field__root emotion-4"
                     data-part="root"
                     data-scope="field"
                     id="field:::r1q:"
                     role="group"
                   >
                     <label
-                      className="chakra-field__label emotion-5"
+                      class="chakra-field__label emotion-5"
                       data-part="label"
                       data-scope="field"
-                      htmlFor=":r1q:"
+                      for=":r1q:"
                       id="field:::r1q:::label"
                     >
                       additionalProperty Key
                     </label>
                     <input
-                      className="chakra-input emotion-6"
+                      class="chakra-input emotion-6"
                       data-part="input"
                       data-scope="field"
-                      defaultValue="additionalProperty"
-                      disabled={false}
                       id="root_additionalProperty-key"
                       name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      readOnly={false}
-                      required={false}
                       type="text"
+                      value="additionalProperty"
                     />
                   </div>
                 </div>
                 <div>
                   <fieldset
                     aria-labelledby="fieldset:::r1r:::legend"
-                    className="fieldset__root emotion-0"
+                    class="fieldset__root emotion-0"
                     data-part="root"
                     data-scope="fieldset"
-                    disabled={false}
                   >
                     <div
-                      className="fieldset__content emotion-1"
+                      class="fieldset__content emotion-1"
                     >
                       <div
-                        className="chakra-field__root emotion-9"
+                        class="chakra-field__root emotion-9"
                         data-part="root"
                         data-scope="field"
                         id="field:::r1s:"
@@ -12358,19 +11820,12 @@ exports[`object fields with title and description with global label off show add
                       >
                         <input
                           aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                          autoFocus={false}
-                          className="chakra-input emotion-10"
+                          class="chakra-input emotion-10"
                           data-part="input"
                           data-scope="field"
-                          disabled={false}
                           id="root_additionalProperty"
                           name="root_additionalProperty"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
                           placeholder=""
-                          readOnly={false}
-                          required={false}
                           type="text"
                           value="should appear"
                         />
@@ -12381,24 +11836,22 @@ exports[`object fields with title and description with global label off show add
                 <div>
                   <button
                     aria-label="Remove"
-                    className="chakra-button rjsf-object-property-remove emotion-11"
-                    disabled={false}
+                    class="chakra-button rjsf-object-property-remove emotion-11"
                     id="root_additionalProperty__remove"
-                    onClick={[Function]}
                     title="Remove"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="lucide lucide-delete"
+                      class="lucide lucide-delete"
                       fill="none"
-                      height={24}
+                      height="24"
                       stroke="currentColor"
-                      strokeLinecap="round"
-                      strokeLinejoin="round"
-                      strokeWidth={2}
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
                       viewBox="0 0 24 24"
-                      width={24}
+                      width="24"
                       xmlns="http://www.w3.org/2000/svg"
                     >
                       <path
@@ -12416,26 +11869,24 @@ exports[`object fields with title and description with global label off show add
               </div>
             </div>
             <div
-              className="emotion-12"
+              class="emotion-12"
             >
               <button
-                className="chakra-button rjsf-object-property-expand emotion-13"
-                disabled={false}
+                class="chakra-button rjsf-object-property-expand emotion-13"
                 id="root__add"
-                onClick={[Function]}
                 type="button"
               >
                 <svg
                   aria-hidden="true"
-                  className="lucide lucide-plus"
+                  class="lucide lucide-plus"
                   fill="none"
-                  height={24}
+                  height="24"
                   stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  stroke-width="2"
                   viewBox="0 0 24 24"
-                  width={24}
+                  width="24"
                   xmlns="http://www.w3.org/2000/svg"
                 >
                   <path
@@ -12453,19 +11904,18 @@ exports[`object fields with title and description with global label off show add
       </fieldset>
     </div>
     <div
-      className="emotion-14"
+      class="emotion-14"
     >
       <button
-        className="chakra-button emotion-13"
-        disabled={false}
+        class="chakra-button emotion-13"
         type="submit"
       >
         Submit
       </button>
     </div>
-  </form>,
+  </form>
   <span
-    hidden={true}
-  />,
-]
+    hidden=""
+  />
+</DocumentFragment>
 `;
diff --git a/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap b/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
index 286786a118..279cd3dc14 100644
--- a/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
+++ b/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
@@ -1,2896 +1,2445 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-object"
+      <fieldset
+        id="root"
       >
-        <fieldset
-          id="root_person"
+        <div
+          class="form-group rjsf-field rjsf-field-object"
         >
-          <legend
-            id="root_person__title"
-          >
-            person
-          </legend>
-          <div
-            className="form-group rjsf-field rjsf-field-string"
+          <fieldset
+            id="root_person"
           >
-            <label
-              className="control-label"
-              htmlFor="root_person_name"
+            <legend
+              id="root_person__title"
             >
-              name
-            </label>
-            <input
-              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_person_name"
-              label="name"
-              name="root[person][name]"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value=""
-            />
-          </div>
-          <div
-            className="form-group rjsf-field rjsf-field-object"
-          >
-            <fieldset
-              id="root_person_address"
+              person
+            </legend>
+            <div
+              class="form-group rjsf-field rjsf-field-string"
             >
-              <legend
-                id="root_person_address__title"
+              <label
+                class="control-label"
+                for="root_person_name"
               >
-                address
-              </legend>
-              <div
-                className="form-group rjsf-field rjsf-field-string"
+                name
+              </label>
+              <input
+                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                class="form-control"
+                id="root_person_name"
+                label="name"
+                name="root[person][name]"
+                placeholder=""
+                type="text"
+                value=""
+              />
+            </div>
+            <div
+              class="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_person_address"
               >
-                <label
-                  className="control-label"
-                  htmlFor="root_person_address_street"
+                <legend
+                  id="root_person_address__title"
                 >
-                  street
-                </label>
-                <input
-                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_person_address_street"
-                  label="street"
-                  name="root[person][address][street]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-              <div
-                className="form-group rjsf-field rjsf-field-string"
-              >
-                <label
-                  className="control-label"
-                  htmlFor="root_person_address_city"
+                  address
+                </legend>
+                <div
+                  class="form-group rjsf-field rjsf-field-string"
                 >
-                  city
-                </label>
-                <input
-                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_person_address_city"
-                  label="city"
-                  name="root[person][address][city]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-              <div
-                className="form-group rjsf-field rjsf-field-string"
-              >
-                <label
-                  className="control-label"
-                  htmlFor="root_person_address_country"
+                  <label
+                    class="control-label"
+                    for="root_person_address_street"
+                  >
+                    street
+                  </label>
+                  <input
+                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                    class="form-control"
+                    id="root_person_address_street"
+                    label="street"
+                    name="root[person][address][street]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
+                <div
+                  class="form-group rjsf-field rjsf-field-string"
                 >
-                  country
-                </label>
-                <input
-                  aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_person_address_country"
-                  label="country"
-                  name="root[person][address][country]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-            </fieldset>
-          </div>
-        </fieldset>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+                  <label
+                    class="control-label"
+                    for="root_person_address_city"
+                  >
+                    city
+                  </label>
+                  <input
+                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                    class="form-control"
+                    id="root_person_address_city"
+                    label="city"
+                    name="root[person][address][city]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
+                <div
+                  class="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    class="control-label"
+                    for="root_person_address_country"
+                  >
+                    country
+                  </label>
+                  <input
+                    aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                    class="form-control"
+                    id="root_person_address_country"
+                    label="country"
+                    name="root[person][address][country]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </fieldset>
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_name"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          name
-        </label>
-        <input
-          aria-describedby="root_name__error root_name__description root_name__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_name"
-          label="name"
-          name="root[name]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value="John"
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
+          <label
+            class="control-label"
+            for="root_name"
+          >
+            name
+          </label>
+          <input
+            aria-describedby="root_name__error root_name__description root_name__help"
+            class="form-control"
+            id="root_name"
+            label="name"
+            name="root[name]"
+            placeholder=""
+            type="text"
+            value="John"
+          />
+        </div>
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_customField-key"
+                >
+                  customField Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_customField-key"
+                  type="text"
+                  value="customField"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_customField-key"
+                class="control-label"
+                for="root_customField"
               >
-                customField Key
+                customField
               </label>
               <input
-                className="form-control"
-                defaultValue="customField"
-                id="root_customField-key"
-                onBlur={[Function]}
+                aria-describedby="root_customField__error root_customField__description root_customField__help"
+                class="form-control"
+                id="root_customField"
+                label="customField"
+                name="root[customField]"
+                placeholder=""
                 type="text"
+                value="customValue"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_customField"
+            <div
+              class="col-xs-2"
             >
-              customField
-            </label>
-            <input
-              aria-describedby="root_customField__error root_customField__description root_customField__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_customField"
-              label="customField"
-              name="root[customField]"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="customValue"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_customField__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_customField__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_name"
-        >
-          name
-        </label>
-        <input
-          aria-describedby="root_name__error root_name__description root_name__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_name"
-          label="name"
-          name="root[name]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value="Alice"
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_age"
-        >
-          age
-        </label>
-        <input
-          aria-describedby="root_age__error root_age__description root_age__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_age"
-          label="age"
-          name="root[age]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value={30}
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-boolean"
+      <fieldset
+        id="root"
       >
         <div
-          className="checkbox "
+          class="form-group rjsf-field rjsf-field-string"
         >
-          <label>
-            <input
-              aria-describedby="root_active__error root_active__description root_active__help"
-              autoFocus={false}
-              checked={true}
-              disabled={false}
-              id="root_active"
-              name="root[active]"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              required={false}
-              type="checkbox"
-            />
-            <span>
-              active
-            </span>
+          <label
+            class="control-label"
+            for="root_name"
+          >
+            name
           </label>
+          <input
+            aria-describedby="root_name__error root_name__description root_name__help"
+            class="form-control"
+            id="root_name"
+            label="name"
+            name="root[name]"
+            placeholder=""
+            type="text"
+            value="Alice"
+          />
         </div>
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-array"
-      >
-        <fieldset
-          className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
-          id="root_tags"
+        <div
+          class="form-group rjsf-field rjsf-field-number"
         >
-          <legend
-            id="root_tags__title"
+          <label
+            class="control-label"
+            for="root_age"
           >
-            tags
-          </legend>
+            age
+          </label>
+          <input
+            aria-describedby="root_age__error root_age__description root_age__help"
+            class="form-control"
+            id="root_age"
+            label="age"
+            name="root[age]"
+            placeholder=""
+            step="any"
+            type="number"
+            value="30"
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-boolean"
+        >
           <div
-            className="row array-item-list"
+            class="checkbox "
           >
+            <label>
+              <input
+                aria-describedby="root_active__error root_active__description root_active__help"
+                checked=""
+                id="root_active"
+                name="root[active]"
+                type="checkbox"
+              />
+              <span>
+                active
+              </span>
+            </label>
+          </div>
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-array"
+        >
+          <fieldset
+            class="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+            id="root_tags"
+          >
+            <legend
+              id="root_tags__title"
+            >
+              tags
+            </legend>
             <div
-              className="rjsf-array-item"
+              class="row array-item-list"
             >
               <div
-                className="col-xs-9"
+                class="rjsf-array-item"
               >
                 <div
-                  className="form-group rjsf-field rjsf-field-string"
+                  class="col-xs-9"
                 >
-                  <label
-                    className="control-label"
-                    htmlFor="root_tags_0"
+                  <div
+                    class="form-group rjsf-field rjsf-field-string"
                   >
-                    tags-1
-                    <span
-                      className="required"
+                    <label
+                      class="control-label"
+                      for="root_tags_0"
                     >
-                      *
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_tags_0"
-                    label="tags-0"
-                    name="root[tags][0]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={true}
-                    type="text"
-                    value="developer"
-                  />
+                      tags-1
+                      <span
+                        class="required"
+                      >
+                        *
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                      class="form-control"
+                      id="root_tags_0"
+                      label="tags-0"
+                      name="root[tags][0]"
+                      placeholder=""
+                      required=""
+                      type="text"
+                      value="developer"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-xs-3 array-item-toolbox"
-              >
                 <div
-                  className="btn-group"
-                  style={
-                    {
-                      "display": "flex",
-                      "justifyContent": "space-around",
-                    }
-                  }
+                  class="col-xs-3 array-item-toolbox"
                 >
-                  <button
-                    className="btn btn-default rjsf-array-item-move-up"
-                    disabled={true}
-                    id="root_tags_0__moveUp"
-                    onClick={[Function]}
-                    title="Move up"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-up"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-default rjsf-array-item-move-down"
-                    disabled={false}
-                    id="root_tags_0__moveDown"
-                    onClick={[Function]}
-                    title="Move down"
-                    type="button"
+                  <div
+                    class="btn-group"
+                    style="display: flex; justify-content: space-around;"
                   >
-                    <i
-                      className="glyphicon glyphicon-arrow-down"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-danger rjsf-array-item-remove"
-                    disabled={false}
-                    id="root_tags_0__remove"
-                    onClick={[Function]}
-                    title="Remove"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-remove"
-                    />
-                  </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-up"
+                      disabled=""
+                      id="root_tags_0__moveUp"
+                      title="Move up"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-up"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-down"
+                      id="root_tags_0__moveDown"
+                      title="Move down"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-down"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-danger rjsf-array-item-remove"
+                      id="root_tags_0__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-remove"
+                      />
+                    </button>
+                  </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="rjsf-array-item"
-            >
               <div
-                className="col-xs-9"
+                class="rjsf-array-item"
               >
                 <div
-                  className="form-group rjsf-field rjsf-field-string"
+                  class="col-xs-9"
                 >
-                  <label
-                    className="control-label"
-                    htmlFor="root_tags_1"
+                  <div
+                    class="form-group rjsf-field rjsf-field-string"
                   >
-                    tags-2
-                    <span
-                      className="required"
+                    <label
+                      class="control-label"
+                      for="root_tags_1"
                     >
-                      *
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_tags_1"
-                    label="tags-1"
-                    name="root[tags][1]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={true}
-                    type="text"
-                    value="designer"
-                  />
+                      tags-2
+                      <span
+                        class="required"
+                      >
+                        *
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                      class="form-control"
+                      id="root_tags_1"
+                      label="tags-1"
+                      name="root[tags][1]"
+                      placeholder=""
+                      required=""
+                      type="text"
+                      value="designer"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-xs-3 array-item-toolbox"
-              >
                 <div
-                  className="btn-group"
-                  style={
-                    {
-                      "display": "flex",
-                      "justifyContent": "space-around",
-                    }
-                  }
+                  class="col-xs-3 array-item-toolbox"
                 >
-                  <button
-                    className="btn btn-default rjsf-array-item-move-up"
-                    disabled={false}
-                    id="root_tags_1__moveUp"
-                    onClick={[Function]}
-                    title="Move up"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-up"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-default rjsf-array-item-move-down"
-                    disabled={true}
-                    id="root_tags_1__moveDown"
-                    onClick={[Function]}
-                    title="Move down"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-down"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-danger rjsf-array-item-remove"
-                    disabled={false}
-                    id="root_tags_1__remove"
-                    onClick={[Function]}
-                    title="Remove"
-                    type="button"
+                  <div
+                    class="btn-group"
+                    style="display: flex; justify-content: space-around;"
                   >
-                    <i
-                      className="glyphicon glyphicon-remove"
-                    />
-                  </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-up"
+                      id="root_tags_1__moveUp"
+                      title="Move up"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-up"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-down"
+                      disabled=""
+                      id="root_tags_1__moveDown"
+                      title="Move down"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-down"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-danger rjsf-array-item-remove"
+                      id="root_tags_1__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-remove"
+                      />
+                    </button>
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className="row"
-          >
-            <p
-              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            <div
+              class="row"
             >
-              <button
-                className="btn btn-info btn-add col-xs-12"
-                disabled={false}
-                id="root_tags__add"
-                onClick={[Function]}
-                title="Add"
-                type="button"
+              <p
+                class="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
               >
-                <i
-                  className="glyphicon glyphicon-plus"
-                />
-              </button>
-            </p>
-          </div>
-        </fieldset>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+                <button
+                  class="btn btn-info btn-add col-xs-12"
+                  id="root_tags__add"
+                  title="Add"
+                  type="button"
+                >
+                  <i
+                    class="glyphicon glyphicon-plus"
+                  />
+                </button>
+              </p>
+            </div>
+          </fieldset>
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_firstName"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          firstName
-        </label>
-        <input
-          aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_firstName"
-          label="firstName"
-          name="root[firstName]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_lastName"
+          <label
+            class="control-label"
+            for="root_firstName"
+          >
+            firstName
+          </label>
+          <input
+            aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+            class="form-control"
+            id="root_firstName"
+            label="firstName"
+            name="root[firstName]"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          lastName
-        </label>
-        <input
-          aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_lastName"
-          label="lastName"
-          name="root[lastName]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_age"
+          <label
+            class="control-label"
+            for="root_lastName"
+          >
+            lastName
+          </label>
+          <input
+            aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+            class="form-control"
+            id="root_lastName"
+            label="lastName"
+            name="root[lastName]"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-number"
         >
-          age
-        </label>
-        <input
-          aria-describedby="root_age__error root_age__description root_age__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_age"
-          label="age"
-          name="root[age]"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+          <label
+            class="control-label"
+            for="root_age"
+          >
+            age
+          </label>
+          <input
+            aria-describedby="root_age__error root_age__description root_age__help"
+            class="form-control"
+            id="root_age"
+            label="age"
+            name="root[age]"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-object"
+      <fieldset
+        id="root"
       >
-        <fieldset
-          id="root_person"
+        <div
+          class="form-group rjsf-field rjsf-field-object"
         >
-          <legend
-            id="root_person__title"
+          <fieldset
+            id="root_person"
           >
-            person
-          </legend>
-          <div
-            className="form-group rjsf-field rjsf-field-string"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_person_name"
+            <legend
+              id="root_person__title"
             >
-              name
-            </label>
-            <input
-              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_person_name"
-              label="name"
-              name="root.person.name"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value=""
-            />
-          </div>
-          <div
-            className="form-group rjsf-field rjsf-field-object"
-          >
-            <fieldset
-              id="root_person_address"
+              person
+            </legend>
+            <div
+              class="form-group rjsf-field rjsf-field-string"
             >
-              <legend
-                id="root_person_address__title"
+              <label
+                class="control-label"
+                for="root_person_name"
               >
-                address
-              </legend>
-              <div
-                className="form-group rjsf-field rjsf-field-string"
+                name
+              </label>
+              <input
+                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                class="form-control"
+                id="root_person_name"
+                label="name"
+                name="root.person.name"
+                placeholder=""
+                type="text"
+                value=""
+              />
+            </div>
+            <div
+              class="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_person_address"
               >
-                <label
-                  className="control-label"
-                  htmlFor="root_person_address_street"
+                <legend
+                  id="root_person_address__title"
                 >
-                  street
-                </label>
-                <input
-                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_person_address_street"
-                  label="street"
-                  name="root.person.address.street"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-              <div
-                className="form-group rjsf-field rjsf-field-string"
-              >
-                <label
-                  className="control-label"
-                  htmlFor="root_person_address_city"
+                  address
+                </legend>
+                <div
+                  class="form-group rjsf-field rjsf-field-string"
                 >
-                  city
-                </label>
-                <input
-                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_person_address_city"
-                  label="city"
-                  name="root.person.address.city"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-            </fieldset>
-          </div>
-        </fieldset>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+                  <label
+                    class="control-label"
+                    for="root_person_address_street"
+                  >
+                    street
+                  </label>
+                  <input
+                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                    class="form-control"
+                    id="root_person_address_street"
+                    label="street"
+                    name="root.person.address.street"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
+                <div
+                  class="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    class="control-label"
+                    for="root_person_address_city"
+                  >
+                    city
+                  </label>
+                  <input
+                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                    class="form-control"
+                    id="root_person_address_city"
+                    label="city"
+                    name="root.person.address.city"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </fieldset>
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_name"
-        >
-          name
-        </label>
-        <input
-          aria-describedby="root_name__error root_name__description root_name__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_name"
-          label="name"
-          name="root.name"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value="Test"
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_count"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          count
-        </label>
-        <input
-          aria-describedby="root_count__error root_count__description root_count__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_count"
-          label="count"
-          name="root.count"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value={5}
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-array"
-      >
-        <fieldset
-          className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
-          id="root_items"
+          <label
+            class="control-label"
+            for="root_name"
+          >
+            name
+          </label>
+          <input
+            aria-describedby="root_name__error root_name__description root_name__help"
+            class="form-control"
+            id="root_name"
+            label="name"
+            name="root.name"
+            placeholder=""
+            type="text"
+            value="Test"
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-number"
         >
-          <legend
-            id="root_items__title"
+          <label
+            class="control-label"
+            for="root_count"
           >
-            items
-          </legend>
-          <div
-            className="row array-item-list"
+            count
+          </label>
+          <input
+            aria-describedby="root_count__error root_count__description root_count__help"
+            class="form-control"
+            id="root_count"
+            label="count"
+            name="root.count"
+            placeholder=""
+            step="any"
+            type="number"
+            value="5"
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-array"
+        >
+          <fieldset
+            class="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+            id="root_items"
           >
+            <legend
+              id="root_items__title"
+            >
+              items
+            </legend>
             <div
-              className="rjsf-array-item"
+              class="row array-item-list"
             >
               <div
-                className="col-xs-9"
+                class="rjsf-array-item"
               >
                 <div
-                  className="form-group rjsf-field rjsf-field-string"
+                  class="col-xs-9"
                 >
-                  <label
-                    className="control-label"
-                    htmlFor="root_items_0"
+                  <div
+                    class="form-group rjsf-field rjsf-field-string"
                   >
-                    items-1
-                    <span
-                      className="required"
+                    <label
+                      class="control-label"
+                      for="root_items_0"
                     >
-                      *
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_items_0"
-                    label="items-0"
-                    name="root.items.0"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={true}
-                    type="text"
-                    value="a"
-                  />
+                      items-1
+                      <span
+                        class="required"
+                      >
+                        *
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                      class="form-control"
+                      id="root_items_0"
+                      label="items-0"
+                      name="root.items.0"
+                      placeholder=""
+                      required=""
+                      type="text"
+                      value="a"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-xs-3 array-item-toolbox"
-              >
                 <div
-                  className="btn-group"
-                  style={
-                    {
-                      "display": "flex",
-                      "justifyContent": "space-around",
-                    }
-                  }
+                  class="col-xs-3 array-item-toolbox"
                 >
-                  <button
-                    className="btn btn-default rjsf-array-item-move-up"
-                    disabled={true}
-                    id="root_items_0__moveUp"
-                    onClick={[Function]}
-                    title="Move up"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-up"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-default rjsf-array-item-move-down"
-                    disabled={false}
-                    id="root_items_0__moveDown"
-                    onClick={[Function]}
-                    title="Move down"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-down"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-danger rjsf-array-item-remove"
-                    disabled={false}
-                    id="root_items_0__remove"
-                    onClick={[Function]}
-                    title="Remove"
-                    type="button"
+                  <div
+                    class="btn-group"
+                    style="display: flex; justify-content: space-around;"
                   >
-                    <i
-                      className="glyphicon glyphicon-remove"
-                    />
-                  </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-up"
+                      disabled=""
+                      id="root_items_0__moveUp"
+                      title="Move up"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-up"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-down"
+                      id="root_items_0__moveDown"
+                      title="Move down"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-down"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-danger rjsf-array-item-remove"
+                      id="root_items_0__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-remove"
+                      />
+                    </button>
+                  </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="rjsf-array-item"
-            >
               <div
-                className="col-xs-9"
+                class="rjsf-array-item"
               >
                 <div
-                  className="form-group rjsf-field rjsf-field-string"
+                  class="col-xs-9"
                 >
-                  <label
-                    className="control-label"
-                    htmlFor="root_items_1"
+                  <div
+                    class="form-group rjsf-field rjsf-field-string"
                   >
-                    items-2
-                    <span
-                      className="required"
+                    <label
+                      class="control-label"
+                      for="root_items_1"
                     >
-                      *
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_items_1"
-                    label="items-1"
-                    name="root.items.1"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={true}
-                    type="text"
-                    value="b"
-                  />
+                      items-2
+                      <span
+                        class="required"
+                      >
+                        *
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                      class="form-control"
+                      id="root_items_1"
+                      label="items-1"
+                      name="root.items.1"
+                      placeholder=""
+                      required=""
+                      type="text"
+                      value="b"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-xs-3 array-item-toolbox"
-              >
                 <div
-                  className="btn-group"
-                  style={
-                    {
-                      "display": "flex",
-                      "justifyContent": "space-around",
-                    }
-                  }
+                  class="col-xs-3 array-item-toolbox"
                 >
-                  <button
-                    className="btn btn-default rjsf-array-item-move-up"
-                    disabled={false}
-                    id="root_items_1__moveUp"
-                    onClick={[Function]}
-                    title="Move up"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-arrow-up"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-default rjsf-array-item-move-down"
-                    disabled={true}
-                    id="root_items_1__moveDown"
-                    onClick={[Function]}
-                    title="Move down"
-                    type="button"
+                  <div
+                    class="btn-group"
+                    style="display: flex; justify-content: space-around;"
                   >
-                    <i
-                      className="glyphicon glyphicon-arrow-down"
-                    />
-                  </button>
-                  <button
-                    className="btn btn-danger rjsf-array-item-remove"
-                    disabled={false}
-                    id="root_items_1__remove"
-                    onClick={[Function]}
-                    title="Remove"
-                    type="button"
-                  >
-                    <i
-                      className="glyphicon glyphicon-remove"
-                    />
-                  </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-up"
+                      id="root_items_1__moveUp"
+                      title="Move up"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-up"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-default rjsf-array-item-move-down"
+                      disabled=""
+                      id="root_items_1__moveDown"
+                      title="Move down"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-arrow-down"
+                      />
+                    </button>
+                    <button
+                      class="btn btn-danger rjsf-array-item-remove"
+                      id="root_items_1__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <i
+                        class="glyphicon glyphicon-remove"
+                      />
+                    </button>
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className="row"
-          >
-            <p
-              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            <div
+              class="row"
             >
-              <button
-                className="btn btn-info btn-add col-xs-12"
-                disabled={false}
-                id="root_items__add"
-                onClick={[Function]}
-                title="Add"
-                type="button"
+              <p
+                class="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
               >
-                <i
-                  className="glyphicon glyphicon-plus"
-                />
-              </button>
-            </p>
-          </div>
-        </fieldset>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+                <button
+                  class="btn btn-info btn-add col-xs-12"
+                  id="root_items__add"
+                  title="Add"
+                  type="button"
+                >
+                  <i
+                    class="glyphicon glyphicon-plus"
+                  />
+                </button>
+              </p>
+            </div>
+          </fieldset>
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_firstName"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          firstName
-        </label>
-        <input
-          aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_firstName"
-          label="firstName"
-          name="root.firstName"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_lastName"
+          <label
+            class="control-label"
+            for="root_firstName"
+          >
+            firstName
+          </label>
+          <input
+            aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+            class="form-control"
+            id="root_firstName"
+            label="firstName"
+            name="root.firstName"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          lastName
-        </label>
-        <input
-          aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_lastName"
-          label="lastName"
-          name="root.lastName"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_age"
+          <label
+            class="control-label"
+            for="root_lastName"
+          >
+            lastName
+          </label>
+          <input
+            aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+            class="form-control"
+            id="root_lastName"
+            label="lastName"
+            name="root.lastName"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-number"
         >
-          age
-        </label>
-        <input
-          aria-describedby="root_age__error root_age__description root_age__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_age"
-          label="age"
-          name="root.age"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+          <label
+            class="control-label"
+            for="root_age"
+          >
+            age
+          </label>
+          <input
+            aria-describedby="root_age__error root_age__description root_age__help"
+            class="form-control"
+            id="root_age"
+            label="age"
+            name="root.age"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_foo-key"
+                >
+                  foo Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_foo-key"
+                  type="text"
+                  value="foo"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_foo-key"
+                class="control-label"
+                for="root_foo"
               >
-                foo Key
+                foo
               </label>
               <input
-                className="form-control"
-                defaultValue="foo"
-                id="root_foo-key"
-                onBlur={[Function]}
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="form-control"
+                id="root_foo"
+                label="foo"
+                name="root_foo"
+                placeholder=""
                 type="text"
+                value="foo"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_foo"
+            <div
+              class="col-xs-2"
             >
-              foo
-            </label>
-            <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_foo"
-              label="foo"
-              name="root_foo"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="foo"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_foo__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_foo__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_a"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          A
-        </label>
-        <input
-          aria-describedby="root_a__error root_a__description root_a__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_a"
-          label="A"
-          name="root_a"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_b"
+          <label
+            class="control-label"
+            for="root_a"
+          >
+            A
+          </label>
+          <input
+            aria-describedby="root_a__error root_a__description root_a__help"
+            class="form-control"
+            id="root_a"
+            label="A"
+            name="root_a"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-number"
         >
-          B
-        </label>
-        <input
-          aria-describedby="root_b__error root_b__description root_b__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_b"
-          label="B"
-          name="root_b"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+          <label
+            class="control-label"
+            for="root_b"
+          >
+            B
+          </label>
+          <input
+            aria-describedby="root_b__error root_b__description root_b__help"
+            class="form-control"
+            id="root_b"
+            label="B"
+            name="root_b"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_additionalProperty-key"
+                >
+                  additionalProperty Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_additionalProperty-key"
+                  type="text"
+                  value="additionalProperty"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_additionalProperty-key"
+                class="control-label"
+                for="root_additionalProperty"
               >
-                additionalProperty Key
+                additionalProperty
               </label>
               <input
-                className="form-control"
-                defaultValue="additionalProperty"
-                id="root_additionalProperty-key"
-                onBlur={[Function]}
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="form-control"
+                id="root_additionalProperty"
+                label="additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
                 type="text"
+                value="should appear"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_additionalProperty"
+            <div
+              class="col-xs-2"
             >
-              additionalProperty
-            </label>
-            <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_additionalProperty"
-              label="additionalProperty"
-              name="root_additionalProperty"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="should appear"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_additionalProperty__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_additionalProperty__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        Test field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a test description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
+        <legend
+          id="root__title"
+        >
+          Test field
+        </legend>
+        <div
+          class="field-description"
+          id="root__description"
+        >
+          a test description
+        </div>
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_foo-key"
+                >
+                  foo Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_foo-key"
+                  type="text"
+                  value="foo"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_foo-key"
+                class="control-label"
+                for="root_foo"
               >
-                foo Key
+                foo
               </label>
               <input
-                className="form-control"
-                defaultValue="foo"
-                id="root_foo-key"
-                onBlur={[Function]}
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="form-control"
+                id="root_foo"
+                label="foo"
+                name="root_foo"
+                placeholder=""
                 type="text"
+                value="foo"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_foo"
+            <div
+              class="col-xs-2"
             >
-              foo
-            </label>
-            <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_foo"
-              label="foo"
-              name="root_foo"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="foo"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_foo__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_foo__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        My Field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a fancier description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
+        <legend
+          id="root__title"
+        >
+          My Field
+        </legend>
         <div
-          className="row"
+          class="field-description"
+          id="root__description"
+        >
+          a fancier description
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_foo-key"
+                >
+                  foo Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_foo-key"
+                  type="text"
+                  value="foo"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_foo-key"
+                class="control-label"
+                for="root_foo"
               >
-                foo Key
+                foo
               </label>
               <input
-                className="form-control"
-                defaultValue="foo"
-                id="root_foo-key"
-                onBlur={[Function]}
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="form-control"
+                id="root_foo"
+                label="foo"
+                name="root_foo"
+                placeholder=""
                 type="text"
+                value="foo"
               />
-            </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_foo"
+            </div>
+            <div
+              class="col-xs-2"
             >
-              foo
-            </label>
-            <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_foo"
-              label="foo"
-              name="root_foo"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="foo"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_foo__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_foo__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        My Field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a fancier description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <label
-          className="control-label"
-          htmlFor="root_a"
+        <legend
+          id="root__title"
         >
-          My Item A
-        </label>
+          My Field
+        </legend>
         <div
-          className="field-description"
-          id="root_a__description"
+          class="field-description"
+          id="root__description"
         >
-          a fancier item A description
+          a fancier description
         </div>
-        <input
-          aria-describedby="root_a__error root_a__description root_a__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_a"
-          label="My Item A"
-          name="root_a"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_b"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          My Item B
-        </label>
+          <label
+            class="control-label"
+            for="root_a"
+          >
+            My Item A
+          </label>
+          <div
+            class="field-description"
+            id="root_a__description"
+          >
+            a fancier item A description
+          </div>
+          <input
+            aria-describedby="root_a__error root_a__description root_a__help"
+            class="form-control"
+            id="root_a"
+            label="My Item A"
+            name="root_a"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
         <div
-          className="field-description"
-          id="root_b__description"
+          class="form-group rjsf-field rjsf-field-number"
         >
-          a fancier item B description
+          <label
+            class="control-label"
+            for="root_b"
+          >
+            My Item B
+          </label>
+          <div
+            class="field-description"
+            id="root_b__description"
+          >
+            a fancier item B description
+          </div>
+          <input
+            aria-describedby="root_b__error root_b__description root_b__help"
+            class="form-control"
+            id="root_b"
+            label="My Item B"
+            name="root_b"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
         </div>
-        <input
-          aria-describedby="root_b__error root_b__description root_b__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_b"
-          label="My Item B"
-          name="root_b"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        My Field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a fancier description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
+        <legend
+          id="root__title"
+        >
+          My Field
+        </legend>
+        <div
+          class="field-description"
+          id="root__description"
+        >
+          a fancier description
+        </div>
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_foo-key"
+                >
+                  foo Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_foo-key"
+                  type="text"
+                  value="foo"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_foo-key"
+                class="control-label"
+                for="root_foo"
               >
-                foo Key
+                foo
               </label>
               <input
-                className="form-control"
-                defaultValue="foo"
-                id="root_foo-key"
-                onBlur={[Function]}
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="form-control"
+                id="root_foo"
+                label="foo"
+                name="root_foo"
+                placeholder=""
                 type="text"
+                value="foo"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_foo"
+            <div
+              class="col-xs-2"
             >
-              foo
-            </label>
-            <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_foo"
-              label="foo"
-              name="root_foo"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="foo"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_foo__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_foo__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        My Field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
+      <fieldset
+        id="root"
       >
-        a fancier description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_a"
+        <legend
+          id="root__title"
         >
-          My Item A
-        </label>
+          My Field
+        </legend>
         <div
-          className="field-description"
-          id="root_a__description"
+          class="field-description"
+          id="root__description"
         >
-          a fancier item A description
+          a fancier description
         </div>
-        <input
-          aria-describedby="root_a__error root_a__description root_a__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_a"
-          label="My Item A"
-          name="root_a"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_b"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          My Item B
-        </label>
+          <label
+            class="control-label"
+            for="root_a"
+          >
+            My Item A
+          </label>
+          <div
+            class="field-description"
+            id="root_a__description"
+          >
+            a fancier item A description
+          </div>
+          <input
+            aria-describedby="root_a__error root_a__description root_a__help"
+            class="form-control"
+            id="root_a"
+            label="My Item A"
+            name="root_a"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
         <div
-          className="field-description"
-          id="root_b__description"
+          class="form-group rjsf-field rjsf-field-number"
         >
-          a fancier item B description
+          <label
+            class="control-label"
+            for="root_b"
+          >
+            My Item B
+          </label>
+          <div
+            class="field-description"
+            id="root_b__description"
+          >
+            a fancier item B description
+          </div>
+          <input
+            aria-describedby="root_b__error root_b__description root_b__help"
+            class="form-control"
+            id="root_b"
+            label="My Item B"
+            name="root_b"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
         </div>
-        <input
-          aria-describedby="root_b__error root_b__description root_b__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_b"
-          label="My Item B"
-          name="root_b"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        My Field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a fancier description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
+        <legend
+          id="root__title"
+        >
+          My Field
+        </legend>
+        <div
+          class="field-description"
+          id="root__description"
+        >
+          a fancier description
+        </div>
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_additionalProperty-key"
+                >
+                  additionalProperty Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_additionalProperty-key"
+                  type="text"
+                  value="additionalProperty"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_additionalProperty-key"
+                class="control-label"
+                for="root_additionalProperty"
               >
-                additionalProperty Key
+                additionalProperty
               </label>
               <input
-                className="form-control"
-                defaultValue="additionalProperty"
-                id="root_additionalProperty-key"
-                onBlur={[Function]}
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="form-control"
+                id="root_additionalProperty"
+                label="additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
                 type="text"
+                value="should appear"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_additionalProperty"
+            <div
+              class="col-xs-2"
             >
-              additionalProperty
-            </label>
-            <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_additionalProperty"
-              label="additionalProperty"
-              name="root_additionalProperty"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="should appear"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_additionalProperty__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_additionalProperty__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
+      <fieldset
+        id="root"
       >
-        Test field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a test description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_a"
+        <legend
+          id="root__title"
         >
-          A
-        </label>
+          Test field
+        </legend>
         <div
-          className="field-description"
-          id="root_a__description"
+          class="field-description"
+          id="root__description"
         >
-          A description
+          a test description
         </div>
-        <input
-          aria-describedby="root_a__error root_a__description root_a__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_a"
-          label="A"
-          name="root_a"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
-      >
-        <label
-          className="control-label"
-          htmlFor="root_b"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
-          B
-        </label>
+          <label
+            class="control-label"
+            for="root_a"
+          >
+            A
+          </label>
+          <div
+            class="field-description"
+            id="root_a__description"
+          >
+            A description
+          </div>
+          <input
+            aria-describedby="root_a__error root_a__description root_a__help"
+            class="form-control"
+            id="root_a"
+            label="A"
+            name="root_a"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
         <div
-          className="field-description"
-          id="root_b__description"
+          class="form-group rjsf-field rjsf-field-number"
         >
-          B description
+          <label
+            class="control-label"
+            for="root_b"
+          >
+            B
+          </label>
+          <div
+            class="field-description"
+            id="root_b__description"
+          >
+            B description
+          </div>
+          <input
+            aria-describedby="root_b__error root_b__description root_b__help"
+            class="form-control"
+            id="root_b"
+            label="B"
+            name="root_b"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
         </div>
-        <input
-          aria-describedby="root_b__error root_b__description root_b__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_b"
-          label="B"
-          name="root_b"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <legend
-        id="root__title"
-      >
-        Test field
-      </legend>
-      <div
-        className="field-description"
-        id="root__description"
-      >
-        a test description
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
+        <legend
+          id="root__title"
+        >
+          Test field
+        </legend>
         <div
-          className="row"
+          class="field-description"
+          id="root__description"
+        >
+          a test description
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
+            >
+              <div
+                class="form-group"
+              >
+                <label
+                  class="control-label"
+                  for="root_additionalProperty-key"
+                >
+                  additionalProperty Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_additionalProperty-key"
+                  type="text"
+                  value="additionalProperty"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
             >
               <label
-                className="control-label"
-                htmlFor="root_additionalProperty-key"
+                class="control-label"
+                for="root_additionalProperty"
               >
-                additionalProperty Key
+                additionalProperty
               </label>
               <input
-                className="form-control"
-                defaultValue="additionalProperty"
-                id="root_additionalProperty-key"
-                onBlur={[Function]}
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="form-control"
+                id="root_additionalProperty"
+                label="additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
                 type="text"
+                value="should appear"
               />
             </div>
-          </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <label
-              className="control-label"
-              htmlFor="root_additionalProperty"
+            <div
+              class="col-xs-2"
             >
-              additionalProperty
-            </label>
-            <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_additionalProperty"
-              label="additionalProperty"
-              name="root_additionalProperty"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="should appear"
-            />
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_additionalProperty__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_additionalProperty__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
             >
-              <label
-                className="control-label"
-                htmlFor="root_foo-key"
+              <div
+                class="form-group"
               >
-                foo Key
-              </label>
+                <label
+                  class="control-label"
+                  for="root_foo-key"
+                >
+                  foo Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_foo-key"
+                  type="text"
+                  value="foo"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
+            >
               <input
-                className="form-control"
-                defaultValue="foo"
-                id="root_foo-key"
-                onBlur={[Function]}
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="form-control"
+                id="root_foo"
+                label="foo"
+                name="root_foo"
+                placeholder=""
                 type="text"
+                value="foo"
               />
             </div>
+            <div
+              class="col-xs-2"
+            >
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_foo__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_foo"
-              label="foo"
-              name="root_foo"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="foo"
-            />
-          </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_foo__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
-        <input
-          aria-describedby="root_a__error root_a__description root_a__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_a"
-          label="A"
-          name="root_a"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          type="text"
-          value=""
-        />
-      </div>
-      <div
-        className="form-group rjsf-field rjsf-field-number"
+        <div
+          class="form-group rjsf-field rjsf-field-string"
+        >
+          <input
+            aria-describedby="root_a__error root_a__description root_a__help"
+            class="form-control"
+            id="root_a"
+            label="A"
+            name="root_a"
+            placeholder=""
+            type="text"
+            value=""
+          />
+        </div>
+        <div
+          class="form-group rjsf-field rjsf-field-number"
+        >
+          <input
+            aria-describedby="root_b__error root_b__description root_b__help"
+            class="form-control"
+            id="root_b"
+            label="B"
+            name="root_b"
+            placeholder=""
+            step="any"
+            type="number"
+            value=""
+          />
+        </div>
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <input
-          aria-describedby="root_b__error root_b__description root_b__help"
-          autoFocus={false}
-          className="form-control"
-          disabled={false}
-          id="root_b"
-          label="B"
-          name="root_b"
-          onBlur={[Function]}
-          onChange={[Function]}
-          onFocus={[Function]}
-          placeholder=""
-          readOnly={false}
-          required={false}
-          step="any"
-          type="number"
-          value=""
-        />
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="form-group rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <fieldset
-      id="root"
+    <div
+      class="form-group rjsf-field rjsf-field-object"
     >
-      <div
-        className="form-group rjsf-field rjsf-field-string"
+      <fieldset
+        id="root"
       >
         <div
-          className="row"
+          class="form-group rjsf-field rjsf-field-string"
         >
           <div
-            className="col-xs-5 form-additional"
+            class="row"
           >
             <div
-              className="form-group"
+              class="col-xs-5 form-additional"
             >
-              <label
-                className="control-label"
-                htmlFor="root_additionalProperty-key"
+              <div
+                class="form-group"
               >
-                additionalProperty Key
-              </label>
+                <label
+                  class="control-label"
+                  for="root_additionalProperty-key"
+                >
+                  additionalProperty Key
+                </label>
+                <input
+                  class="form-control"
+                  id="root_additionalProperty-key"
+                  type="text"
+                  value="additionalProperty"
+                />
+              </div>
+            </div>
+            <div
+              class="form-additional form-group col-xs-5"
+            >
               <input
-                className="form-control"
-                defaultValue="additionalProperty"
-                id="root_additionalProperty-key"
-                onBlur={[Function]}
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="form-control"
+                id="root_additionalProperty"
+                label="additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
                 type="text"
+                value="should appear"
               />
             </div>
+            <div
+              class="col-xs-2"
+            >
+              <button
+                class="btn btn-danger rjsf-object-property-remove btn-block"
+                id="root_additionalProperty__remove"
+                style="border: 0px;"
+                title="Remove"
+                type="button"
+              >
+                <i
+                  class="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
           </div>
-          <div
-            className="form-additional form-group col-xs-5"
-          >
-            <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="form-control"
-              disabled={false}
-              id="root_additionalProperty"
-              label="additionalProperty"
-              name="root_additionalProperty"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              placeholder=""
-              readOnly={false}
-              required={false}
-              type="text"
-              value="should appear"
-            />
-          </div>
-          <div
-            className="col-xs-2"
+        </div>
+        <div
+          class="row"
+        >
+          <p
+            class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
           >
             <button
-              className="btn btn-danger rjsf-object-property-remove btn-block"
-              disabled={false}
-              id="root_additionalProperty__remove"
-              onClick={[Function]}
-              style={
-                {
-                  "border": "0",
-                }
-              }
-              title="Remove"
+              class="btn btn-info btn-add col-xs-12"
+              id="root__add"
+              title="Add"
               type="button"
             >
               <i
-                className="glyphicon glyphicon-remove"
+                class="glyphicon glyphicon-plus"
               />
             </button>
-          </div>
+          </p>
         </div>
-      </div>
-      <div
-        className="row"
+      </fieldset>
+    </div>
+    <div>
+      <button
+        class="btn btn-info "
+        type="submit"
       >
-        <p
-          className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand"
-        >
-          <button
-            className="btn btn-info btn-add col-xs-12"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add"
-            type="button"
-          >
-            <i
-              className="glyphicon glyphicon-plus"
-            />
-          </button>
-        </p>
-      </div>
-    </fieldset>
-  </div>
-  <div>
-    <button
-      className="btn btn-info "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/daisyui/test/__snapshots__/Object.test.tsx.snap b/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
index c63d5f321c..004fff2c9f 100644
--- a/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
@@ -1,5685 +1,5049 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-object"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-object"
-                disabled={false}
+                class="rjsf-field rjsf-field-object"
               >
                 <div
-                  className="form-control "
+                  class="field-template mb-3 rjsf-field rjsf-field-object"
                 >
                   <div
-                    className="title-field mb-6"
-                    id="root_person__title"
+                    class="form-control "
                   >
-                    <h2
-                      className="text-3xl font-bold text-primary mb-2"
-                    >
-                      person
-                    </h2>
                     <div
-                      className="divider divider-primary my-0"
-                    />
-                  </div>
-                  <div
-                    className="grid grid-cols-1 gap-4 mb-4"
-                  >
+                      class="title-field mb-6"
+                      id="root_person__title"
+                    >
+                      <h2
+                        class="text-3xl font-bold text-primary mb-2"
+                      >
+                        person
+                      </h2>
+                      <div
+                        class="divider divider-primary my-0"
+                      />
+                    </div>
                     <div
-                      className=""
+                      class="grid grid-cols-1 gap-4 mb-4"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class=""
                       >
                         <div
-                          className="field-template mb-3 rjsf-field rjsf-field-string"
-                          disabled={false}
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            className="label"
-                            htmlFor="root_person_name"
-                          >
-                            <span
-                              className="label-text font-medium"
-                            >
-                              name
-                            </span>
-                          </label>
                           <div
-                            className="form-control"
+                            class="field-template mb-3 rjsf-field rjsf-field-string"
                           >
                             <label
-                              className="label hidden"
-                              htmlFor="root_person_name"
-                              style={
-                                {
-                                  "display": "none",
-                                }
-                              }
+                              class="label"
+                              for="root_person_name"
                             >
                               <span
-                                className="label-text"
+                                class="label-text font-medium"
                               >
                                 name
                               </span>
                             </label>
-                            <input
-                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                              autoFocus={false}
-                              className="input input-bordered"
-                              disabled={false}
-                              id="root_person_name"
-                              name="root[person][name]"
-                              onBlur={[Function]}
-                              onChange={[Function]}
-                              onFocus={[Function]}
-                              placeholder=""
-                              required={false}
-                              type="text"
-                              value=""
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-error-template text-red-600"
-                          >
-                            <ul
-                              className="list-disc list-inside"
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-help-template text-gray-500 text-sm"
-                          >
-                            <div />
+                            <div
+                              class="form-control"
+                            >
+                              <label
+                                class="label hidden"
+                                for="root_person_name"
+                                style="display: none;"
+                              >
+                                <span
+                                  class="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                class="input input-bordered"
+                                id="root_person_name"
+                                name="root[person][name]"
+                                placeholder=""
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-error-template text-red-600"
+                            >
+                              <ul
+                                class="list-disc list-inside"
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className=""
-                    >
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class=""
                       >
                         <div
-                          className="field-template mb-3 rjsf-field rjsf-field-object"
-                          disabled={false}
+                          class="rjsf-field rjsf-field-object"
                         >
                           <div
-                            className="form-control "
+                            class="field-template mb-3 rjsf-field rjsf-field-object"
                           >
                             <div
-                              className="title-field mb-6"
-                              id="root_person_address__title"
+                              class="form-control "
                             >
-                              <h2
-                                className="text-3xl font-bold text-primary mb-2"
-                              >
-                                address
-                              </h2>
                               <div
-                                className="divider divider-primary my-0"
-                              />
-                            </div>
-                            <div
-                              className="grid grid-cols-1 gap-4 mb-4"
-                            >
+                                class="title-field mb-6"
+                                id="root_person_address__title"
+                              >
+                                <h2
+                                  class="text-3xl font-bold text-primary mb-2"
+                                >
+                                  address
+                                </h2>
+                                <div
+                                  class="divider divider-primary my-0"
+                                />
+                              </div>
                               <div
-                                className=""
+                                class="grid grid-cols-1 gap-4 mb-4"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class=""
                                 >
                                   <div
-                                    className="field-template mb-3 rjsf-field rjsf-field-string"
-                                    disabled={false}
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="label"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      <span
-                                        className="label-text font-medium"
-                                      >
-                                        street
-                                      </span>
-                                    </label>
                                     <div
-                                      className="form-control"
+                                      class="field-template mb-3 rjsf-field rjsf-field-string"
                                     >
                                       <label
-                                        className="label hidden"
-                                        htmlFor="root_person_address_street"
-                                        style={
-                                          {
-                                            "display": "none",
-                                          }
-                                        }
+                                        class="label"
+                                        for="root_person_address_street"
                                       >
                                         <span
-                                          className="label-text"
+                                          class="label-text font-medium"
                                         >
                                           street
                                         </span>
                                       </label>
-                                      <input
-                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                        autoFocus={false}
-                                        className="input input-bordered"
-                                        disabled={false}
-                                        id="root_person_address_street"
-                                        name="root[person][address][street]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-error-template text-red-600"
-                                    >
-                                      <ul
-                                        className="list-disc list-inside"
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-help-template text-gray-500 text-sm"
-                                    >
-                                      <div />
+                                      <div
+                                        class="form-control"
+                                      >
+                                        <label
+                                          class="label hidden"
+                                          for="root_person_address_street"
+                                          style="display: none;"
+                                        >
+                                          <span
+                                            class="label-text"
+                                          >
+                                            street
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                          class="input input-bordered"
+                                          id="root_person_address_street"
+                                          name="root[person][address][street]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-error-template text-red-600"
+                                      >
+                                        <ul
+                                          class="list-disc list-inside"
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-help-template text-gray-500 text-sm"
+                                      >
+                                        <div />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
-                              </div>
-                              <div
-                                className=""
-                              >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class=""
                                 >
                                   <div
-                                    className="field-template mb-3 rjsf-field rjsf-field-string"
-                                    disabled={false}
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="label"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      <span
-                                        className="label-text font-medium"
-                                      >
-                                        city
-                                      </span>
-                                    </label>
                                     <div
-                                      className="form-control"
+                                      class="field-template mb-3 rjsf-field rjsf-field-string"
                                     >
                                       <label
-                                        className="label hidden"
-                                        htmlFor="root_person_address_city"
-                                        style={
-                                          {
-                                            "display": "none",
-                                          }
-                                        }
+                                        class="label"
+                                        for="root_person_address_city"
                                       >
                                         <span
-                                          className="label-text"
+                                          class="label-text font-medium"
                                         >
                                           city
                                         </span>
                                       </label>
-                                      <input
-                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                        autoFocus={false}
-                                        className="input input-bordered"
-                                        disabled={false}
-                                        id="root_person_address_city"
-                                        name="root[person][address][city]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-error-template text-red-600"
-                                    >
-                                      <ul
-                                        className="list-disc list-inside"
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-help-template text-gray-500 text-sm"
-                                    >
-                                      <div />
+                                      <div
+                                        class="form-control"
+                                      >
+                                        <label
+                                          class="label hidden"
+                                          for="root_person_address_city"
+                                          style="display: none;"
+                                        >
+                                          <span
+                                            class="label-text"
+                                          >
+                                            city
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                          class="input input-bordered"
+                                          id="root_person_address_city"
+                                          name="root[person][address][city]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-error-template text-red-600"
+                                      >
+                                        <ul
+                                          class="list-disc list-inside"
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-help-template text-gray-500 text-sm"
+                                      >
+                                        <div />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
-                              </div>
-                              <div
-                                className=""
-                              >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class=""
                                 >
                                   <div
-                                    className="field-template mb-3 rjsf-field rjsf-field-string"
-                                    disabled={false}
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="label"
-                                      htmlFor="root_person_address_country"
-                                    >
-                                      <span
-                                        className="label-text font-medium"
-                                      >
-                                        country
-                                      </span>
-                                    </label>
                                     <div
-                                      className="form-control"
+                                      class="field-template mb-3 rjsf-field rjsf-field-string"
                                     >
                                       <label
-                                        className="label hidden"
-                                        htmlFor="root_person_address_country"
-                                        style={
-                                          {
-                                            "display": "none",
-                                          }
-                                        }
+                                        class="label"
+                                        for="root_person_address_country"
                                       >
                                         <span
-                                          className="label-text"
+                                          class="label-text font-medium"
                                         >
                                           country
                                         </span>
                                       </label>
-                                      <input
-                                        aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                        autoFocus={false}
-                                        className="input input-bordered"
-                                        disabled={false}
-                                        id="root_person_address_country"
-                                        name="root[person][address][country]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-error-template text-red-600"
-                                    >
-                                      <ul
-                                        className="list-disc list-inside"
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-help-template text-gray-500 text-sm"
-                                    >
-                                      <div />
+                                      <div
+                                        class="form-control"
+                                      >
+                                        <label
+                                          class="label hidden"
+                                          for="root_person_address_country"
+                                          style="display: none;"
+                                        >
+                                          <span
+                                            class="label-text"
+                                          >
+                                            country
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                          class="input input-bordered"
+                                          id="root_person_address_country"
+                                          name="root[person][address][country]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-error-template text-red-600"
+                                      >
+                                        <ul
+                                          class="list-disc list-inside"
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-help-template text-gray-500 text-sm"
+                                      >
+                                        <div />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
-                          </div>
-                          <div
-                            className="rjsf-field-error-template text-red-600"
-                          >
-                            <ul
-                              className="list-disc list-inside"
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-help-template text-gray-500 text-sm"
-                          >
-                            <div />
+                            <div
+                              class="rjsf-field-error-template text-red-600"
+                            >
+                              <ul
+                                class="list-disc list-inside"
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
                           </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_name"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    name
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_name"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_name"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       name
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="John"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_name"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        name
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="input input-bordered"
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
+                      type="text"
+                      value="John"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_customField-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      customField Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="customField"
-                    disabled={false}
-                    id="root_customField-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_customField"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      customField
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_customField"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_customField-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        customField
+                        customField Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_customField__error root_customField__description root_customField__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_customField"
-                      name="root[customField]"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_customField-key"
                       type="text"
-                      value="customValue"
+                      value="customField"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_customField"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        customField
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_customField"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          customField
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_customField__error root_customField__description root_customField__help"
+                        class="input input-bordered"
+                        id="root_customField"
+                        name="root[customField]"
+                        placeholder=""
+                        type="text"
+                        value="customValue"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_customField__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_customField__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_name"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    name
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_name"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_name"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       name
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="Alice"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
-                </div>
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_name"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        name
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="input input-bordered"
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
+                      type="text"
+                      value="Alice"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
+                </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_age"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    age
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_age"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_age"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       age
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={30}
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_age"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        age
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="input input-bordered"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="30"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-boolean"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-boolean"
-                disabled={false}
+                class="rjsf-field rjsf-field-boolean"
               >
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-boolean"
                 >
-                  <label
-                    className="label cursor-pointer justify-start"
+                  <div
+                    class="form-control"
                   >
-                    <div
-                      className="mr-2"
-                    >
-                      <input
-                        checked={true}
-                        className="checkbox"
-                        disabled={false}
-                        id="root_active"
-                        name="root[active]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        required={false}
-                        type="checkbox"
-                      />
-                    </div>
-                    <span
-                      className="label-text"
+                    <label
+                      class="label cursor-pointer justify-start"
                     >
-                      active
-                    </span>
-                  </label>
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                      <div
+                        class="mr-2"
+                      >
+                        <input
+                          checked=""
+                          class="checkbox"
+                          id="root_active"
+                          name="root[active]"
+                          type="checkbox"
+                        />
+                      </div>
+                      <span
+                        class="label-text"
+                      >
+                        active
+                      </span>
+                    </label>
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-array"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-array"
-                disabled={false}
+                class="rjsf-field rjsf-field-array"
               >
                 <div
-                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                  class="field-template mb-3 rjsf-field rjsf-field-array"
                 >
                   <div
-                    className="title-field mb-6"
-                    id="root_tags__title"
+                    class="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
                   >
-                    <h2
-                      className="text-3xl font-bold text-primary mb-2"
-                    >
-                      tags
-                    </h2>
                     <div
-                      className="divider divider-primary my-0"
-                    />
-                  </div>
-                  <div
-                    className="flex flex-col gap-4"
-                  >
+                      class="title-field mb-6"
+                      id="root_tags__title"
+                    >
+                      <h2
+                        class="text-3xl font-bold text-primary mb-2"
+                      >
+                        tags
+                      </h2>
+                      <div
+                        class="divider divider-primary my-0"
+                      />
+                    </div>
                     <div
-                      className="rjsf-array-item-list"
+                      class="flex flex-col gap-4"
                     >
-                      <fieldset
-                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      <div
+                        class="rjsf-array-item-list"
                       >
-                        <div
-                          className="rjsf-field rjsf-field-string"
+                        <fieldset
+                          class="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
                         >
                           <div
-                            className="field-template mb-3 rjsf-field rjsf-field-string"
-                            disabled={false}
+                            class="rjsf-field rjsf-field-string"
                           >
-                            <label
-                              className="label"
-                              htmlFor="root_tags_0"
-                            >
-                              <span
-                                className="label-text font-medium"
-                              >
-                                tags-1
-                                <span
-                                  className="text-error ml-1"
-                                >
-                                  *
-                                </span>
-                              </span>
-                            </label>
                             <div
-                              className="form-control"
+                              class="field-template mb-3 rjsf-field rjsf-field-string"
                             >
                               <label
-                                className="label hidden"
-                                htmlFor="root_tags_0"
-                                style={
-                                  {
-                                    "display": "none",
-                                  }
-                                }
+                                class="label"
+                                for="root_tags_0"
                               >
                                 <span
-                                  className="label-text"
+                                  class="label-text font-medium"
                                 >
-                                  tags-0
+                                  tags-1
+                                  <span
+                                    class="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
                                 </span>
                               </label>
-                              <input
-                                aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                autoFocus={false}
-                                className="input input-bordered"
-                                disabled={false}
-                                id="root_tags_0"
-                                name="root[tags][0]"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="developer"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-error-template text-red-600"
-                            >
-                              <ul
-                                className="list-disc list-inside"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-help-template text-gray-500 text-sm"
-                            >
-                              <div />
+                              <div
+                                class="form-control"
+                              >
+                                <label
+                                  class="label hidden"
+                                  for="root_tags_0"
+                                  style="display: none;"
+                                >
+                                  <span
+                                    class="label-text"
+                                  >
+                                    tags-0
+                                  </span>
+                                </label>
+                                <input
+                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                  class="input input-bordered"
+                                  id="root_tags_0"
+                                  name="root[tags][0]"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="developer"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-error-template text-red-600"
+                              >
+                                <ul
+                                  class="list-disc list-inside"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-help-template text-gray-500 text-sm"
+                              >
+                                <div />
+                              </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="flex justify-end mt-2"
-                        >
                           <div
-                            className="join"
+                            class="flex justify-end mt-2"
                           >
-                            <button
-                              aria-label="Move up"
-                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
-                              disabled={true}
-                              id="root_tags_0__moveUp"
-                              onClick={[Function]}
-                              title="Move up"
-                              type="button"
+                            <div
+                              class="join"
                             >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-up h-5 w-5"
-                                data-icon="arrow-up"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
+                              <button
+                                aria-label="Move up"
+                                class="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled=""
+                                id="root_tags_0__moveUp"
+                                title="Move up"
+                                type="button"
                               >
-                                <path
-                                  d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Move down"
-                              className="rjsf-array-item-move-down join-item btn btn-sm px-2"
-                              disabled={false}
-                              id="root_tags_0__moveDown"
-                              onClick={[Function]}
-                              title="Move down"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-down h-5 w-5"
-                                data-icon="arrow-down"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-up h-5 w-5"
+                                  data-icon="arrow-up"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                class="rjsf-array-item-move-down join-item btn btn-sm px-2"
+                                id="root_tags_0__moveDown"
+                                title="Move down"
+                                type="button"
                               >
-                                <path
-                                  d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Remove"
-                              className="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
-                              disabled={false}
-                              id="root_tags_0__remove"
-                              onClick={[Function]}
-                              title="Remove"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-trash h-5 w-5"
-                                data-icon="trash"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 448 512"
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-down h-5 w-5"
+                                  data-icon="arrow-down"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                class="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
+                                id="root_tags_0__remove"
+                                title="Remove"
+                                type="button"
                               >
-                                <path
-                                  d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-trash h-5 w-5"
+                                  data-icon="trash"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 448 512"
+                                >
+                                  <path
+                                    d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
                           </div>
-                        </div>
-                      </fieldset>
-                      <fieldset
-                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
-                      >
-                        <div
-                          className="rjsf-field rjsf-field-string"
+                        </fieldset>
+                        <fieldset
+                          class="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
                         >
                           <div
-                            className="field-template mb-3 rjsf-field rjsf-field-string"
-                            disabled={false}
+                            class="rjsf-field rjsf-field-string"
                           >
-                            <label
-                              className="label"
-                              htmlFor="root_tags_1"
-                            >
-                              <span
-                                className="label-text font-medium"
-                              >
-                                tags-2
-                                <span
-                                  className="text-error ml-1"
-                                >
-                                  *
-                                </span>
-                              </span>
-                            </label>
                             <div
-                              className="form-control"
+                              class="field-template mb-3 rjsf-field rjsf-field-string"
                             >
                               <label
-                                className="label hidden"
-                                htmlFor="root_tags_1"
-                                style={
-                                  {
-                                    "display": "none",
-                                  }
-                                }
+                                class="label"
+                                for="root_tags_1"
                               >
                                 <span
-                                  className="label-text"
+                                  class="label-text font-medium"
                                 >
-                                  tags-1
+                                  tags-2
+                                  <span
+                                    class="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
                                 </span>
                               </label>
-                              <input
-                                aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                autoFocus={false}
-                                className="input input-bordered"
-                                disabled={false}
-                                id="root_tags_1"
-                                name="root[tags][1]"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="designer"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-error-template text-red-600"
-                            >
-                              <ul
-                                className="list-disc list-inside"
-                              />
+                              <div
+                                class="form-control"
+                              >
+                                <label
+                                  class="label hidden"
+                                  for="root_tags_1"
+                                  style="display: none;"
+                                >
+                                  <span
+                                    class="label-text"
+                                  >
+                                    tags-1
+                                  </span>
+                                </label>
+                                <input
+                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                  class="input input-bordered"
+                                  id="root_tags_1"
+                                  name="root[tags][1]"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="designer"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-error-template text-red-600"
+                              >
+                                <ul
+                                  class="list-disc list-inside"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-help-template text-gray-500 text-sm"
+                              >
+                                <div />
+                              </div>
                             </div>
+                          </div>
+                          <div
+                            class="flex justify-end mt-2"
+                          >
                             <div
-                              className="rjsf-field-help-template text-gray-500 text-sm"
+                              class="join"
                             >
-                              <div />
+                              <button
+                                aria-label="Move up"
+                                class="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                id="root_tags_1__moveUp"
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-up h-5 w-5"
+                                  data-icon="arrow-up"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                class="rjsf-array-item-move-down join-item btn btn-sm px-2"
+                                disabled=""
+                                id="root_tags_1__moveDown"
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-down h-5 w-5"
+                                  data-icon="arrow-down"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                class="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
+                                id="root_tags_1__remove"
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-trash h-5 w-5"
+                                  data-icon="trash"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 448 512"
+                                >
+                                  <path
+                                    d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
                             </div>
                           </div>
-                        </div>
+                        </fieldset>
+                      </div>
+                      <div
+                        class="flex justify-end"
+                      >
                         <div
-                          className="flex justify-end mt-2"
+                          class="row"
                         >
-                          <div
-                            className="join"
+                          <p
+                            class="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add btn btn-primary btn-sm"
                           >
                             <button
-                              aria-label="Move up"
-                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
-                              disabled={false}
-                              id="root_tags_1__moveUp"
-                              onClick={[Function]}
-                              title="Move up"
+                              aria-label="Add"
+                              class="btn-add col-xs-12 btn-primary btn-primary-content"
+                              id="root_tags__add"
+                              title="Add"
                               type="button"
                             >
                               <svg
                                 aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-up h-5 w-5"
-                                data-icon="arrow-up"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
-                              >
-                                <path
-                                  d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Move down"
-                              className="rjsf-array-item-move-down join-item btn btn-sm px-2"
-                              disabled={true}
-                              id="root_tags_1__moveDown"
-                              onClick={[Function]}
-                              title="Move down"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-down h-5 w-5"
-                                data-icon="arrow-down"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
-                              >
-                                <path
-                                  d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Remove"
-                              className="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
-                              disabled={false}
-                              id="root_tags_1__remove"
-                              onClick={[Function]}
-                              title="Remove"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-trash h-5 w-5"
-                                data-icon="trash"
+                                class="svg-inline--fa fa-plus h-5 w-5"
+                                data-icon="plus"
                                 data-prefix="fas"
                                 role="img"
                                 viewBox="0 0 448 512"
                               >
                                 <path
-                                  d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                  d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                                   fill="currentColor"
                                 />
                               </svg>
                             </button>
-                          </div>
+                          </p>
                         </div>
-                      </fieldset>
-                    </div>
-                    <div
-                      className="flex justify-end"
-                    >
-                      <div
-                        className="row"
-                      >
-                        <p
-                          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add btn btn-primary btn-sm"
-                        >
-                          <button
-                            aria-label="Add"
-                            className="btn-add col-xs-12 btn-primary btn-primary-content"
-                            disabled={false}
-                            id="root_tags__add"
-                            onClick={[Function]}
-                            title="Add"
-                            type="button"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              className="svg-inline--fa fa-plus h-5 w-5"
-                              data-icon="plus"
-                              data-prefix="fas"
-                              role="img"
-                              viewBox="0 0 448 512"
-                            >
-                              <path
-                                d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                                fill="currentColor"
-                              />
-                            </svg>
-                          </button>
-                        </p>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_firstName"
+                <div
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
-                  <span
-                    className="label-text font-medium"
+                  <label
+                    class="label"
+                    for="root_firstName"
+                  >
+                    <span
+                      class="label-text font-medium"
+                    >
+                      firstName
+                    </span>
+                  </label>
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_firstName"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        firstName
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      class="input input-bordered"
+                      id="root_firstName"
+                      name="root[firstName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
                   >
-                    firstName
-                  </span>
-                </label>
-                <div
-                  className="form-control"
-                >
-                  <label
-                    className="label hidden"
-                    htmlFor="root_firstName"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
                   >
-                    <span
-                      className="label-text"
-                    >
-                      firstName
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root[firstName]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_lastName"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    lastName
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_lastName"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_lastName"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       lastName
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root[lastName]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_lastName"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        lastName
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                      class="input input-bordered"
+                      id="root_lastName"
+                      name="root[lastName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_age"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    age
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_age"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_age"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       age
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_age"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        age
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="input input-bordered"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-object"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-object"
-                disabled={false}
+                class="rjsf-field rjsf-field-object"
               >
                 <div
-                  className="form-control "
+                  class="field-template mb-3 rjsf-field rjsf-field-object"
                 >
                   <div
-                    className="title-field mb-6"
-                    id="root_person__title"
+                    class="form-control "
                   >
-                    <h2
-                      className="text-3xl font-bold text-primary mb-2"
-                    >
-                      person
-                    </h2>
                     <div
-                      className="divider divider-primary my-0"
-                    />
-                  </div>
-                  <div
-                    className="grid grid-cols-1 gap-4 mb-4"
-                  >
+                      class="title-field mb-6"
+                      id="root_person__title"
+                    >
+                      <h2
+                        class="text-3xl font-bold text-primary mb-2"
+                      >
+                        person
+                      </h2>
+                      <div
+                        class="divider divider-primary my-0"
+                      />
+                    </div>
                     <div
-                      className=""
+                      class="grid grid-cols-1 gap-4 mb-4"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class=""
                       >
                         <div
-                          className="field-template mb-3 rjsf-field rjsf-field-string"
-                          disabled={false}
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            className="label"
-                            htmlFor="root_person_name"
-                          >
-                            <span
-                              className="label-text font-medium"
-                            >
-                              name
-                            </span>
-                          </label>
                           <div
-                            className="form-control"
+                            class="field-template mb-3 rjsf-field rjsf-field-string"
                           >
                             <label
-                              className="label hidden"
-                              htmlFor="root_person_name"
-                              style={
-                                {
-                                  "display": "none",
-                                }
-                              }
+                              class="label"
+                              for="root_person_name"
                             >
                               <span
-                                className="label-text"
+                                class="label-text font-medium"
                               >
                                 name
                               </span>
                             </label>
-                            <input
-                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                              autoFocus={false}
-                              className="input input-bordered"
-                              disabled={false}
-                              id="root_person_name"
-                              name="root.person.name"
-                              onBlur={[Function]}
-                              onChange={[Function]}
-                              onFocus={[Function]}
-                              placeholder=""
-                              required={false}
-                              type="text"
-                              value=""
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-error-template text-red-600"
-                          >
-                            <ul
-                              className="list-disc list-inside"
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-help-template text-gray-500 text-sm"
-                          >
-                            <div />
+                            <div
+                              class="form-control"
+                            >
+                              <label
+                                class="label hidden"
+                                for="root_person_name"
+                                style="display: none;"
+                              >
+                                <span
+                                  class="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                class="input input-bordered"
+                                id="root_person_name"
+                                name="root.person.name"
+                                placeholder=""
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-error-template text-red-600"
+                            >
+                              <ul
+                                class="list-disc list-inside"
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className=""
-                    >
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class=""
                       >
                         <div
-                          className="field-template mb-3 rjsf-field rjsf-field-object"
-                          disabled={false}
+                          class="rjsf-field rjsf-field-object"
                         >
                           <div
-                            className="form-control "
+                            class="field-template mb-3 rjsf-field rjsf-field-object"
                           >
                             <div
-                              className="title-field mb-6"
-                              id="root_person_address__title"
+                              class="form-control "
                             >
-                              <h2
-                                className="text-3xl font-bold text-primary mb-2"
-                              >
-                                address
-                              </h2>
                               <div
-                                className="divider divider-primary my-0"
-                              />
-                            </div>
-                            <div
-                              className="grid grid-cols-1 gap-4 mb-4"
-                            >
+                                class="title-field mb-6"
+                                id="root_person_address__title"
+                              >
+                                <h2
+                                  class="text-3xl font-bold text-primary mb-2"
+                                >
+                                  address
+                                </h2>
+                                <div
+                                  class="divider divider-primary my-0"
+                                />
+                              </div>
                               <div
-                                className=""
+                                class="grid grid-cols-1 gap-4 mb-4"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class=""
                                 >
                                   <div
-                                    className="field-template mb-3 rjsf-field rjsf-field-string"
-                                    disabled={false}
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="label"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      <span
-                                        className="label-text font-medium"
-                                      >
-                                        street
-                                      </span>
-                                    </label>
                                     <div
-                                      className="form-control"
+                                      class="field-template mb-3 rjsf-field rjsf-field-string"
                                     >
                                       <label
-                                        className="label hidden"
-                                        htmlFor="root_person_address_street"
-                                        style={
-                                          {
-                                            "display": "none",
-                                          }
-                                        }
+                                        class="label"
+                                        for="root_person_address_street"
                                       >
                                         <span
-                                          className="label-text"
+                                          class="label-text font-medium"
                                         >
                                           street
                                         </span>
                                       </label>
-                                      <input
-                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                        autoFocus={false}
-                                        className="input input-bordered"
-                                        disabled={false}
-                                        id="root_person_address_street"
-                                        name="root.person.address.street"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-error-template text-red-600"
-                                    >
-                                      <ul
-                                        className="list-disc list-inside"
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-help-template text-gray-500 text-sm"
-                                    >
-                                      <div />
+                                      <div
+                                        class="form-control"
+                                      >
+                                        <label
+                                          class="label hidden"
+                                          for="root_person_address_street"
+                                          style="display: none;"
+                                        >
+                                          <span
+                                            class="label-text"
+                                          >
+                                            street
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                          class="input input-bordered"
+                                          id="root_person_address_street"
+                                          name="root.person.address.street"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-error-template text-red-600"
+                                      >
+                                        <ul
+                                          class="list-disc list-inside"
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-help-template text-gray-500 text-sm"
+                                      >
+                                        <div />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
-                              </div>
-                              <div
-                                className=""
-                              >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class=""
                                 >
                                   <div
-                                    className="field-template mb-3 rjsf-field rjsf-field-string"
-                                    disabled={false}
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="label"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      <span
-                                        className="label-text font-medium"
-                                      >
-                                        city
-                                      </span>
-                                    </label>
                                     <div
-                                      className="form-control"
+                                      class="field-template mb-3 rjsf-field rjsf-field-string"
                                     >
                                       <label
-                                        className="label hidden"
-                                        htmlFor="root_person_address_city"
-                                        style={
-                                          {
-                                            "display": "none",
-                                          }
-                                        }
+                                        class="label"
+                                        for="root_person_address_city"
                                       >
                                         <span
-                                          className="label-text"
+                                          class="label-text font-medium"
                                         >
                                           city
                                         </span>
                                       </label>
-                                      <input
-                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                        autoFocus={false}
-                                        className="input input-bordered"
-                                        disabled={false}
-                                        id="root_person_address_city"
-                                        name="root.person.address.city"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-error-template text-red-600"
-                                    >
-                                      <ul
-                                        className="list-disc list-inside"
-                                      />
-                                    </div>
-                                    <div
-                                      className="rjsf-field-help-template text-gray-500 text-sm"
-                                    >
-                                      <div />
+                                      <div
+                                        class="form-control"
+                                      >
+                                        <label
+                                          class="label hidden"
+                                          for="root_person_address_city"
+                                          style="display: none;"
+                                        >
+                                          <span
+                                            class="label-text"
+                                          >
+                                            city
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                          class="input input-bordered"
+                                          id="root_person_address_city"
+                                          name="root.person.address.city"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-error-template text-red-600"
+                                      >
+                                        <ul
+                                          class="list-disc list-inside"
+                                        />
+                                      </div>
+                                      <div
+                                        class="rjsf-field-help-template text-gray-500 text-sm"
+                                      >
+                                        <div />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
                             </div>
-                          </div>
-                          <div
-                            className="rjsf-field-error-template text-red-600"
-                          >
-                            <ul
-                              className="list-disc list-inside"
-                            />
-                          </div>
-                          <div
-                            className="rjsf-field-help-template text-gray-500 text-sm"
-                          >
-                            <div />
+                            <div
+                              class="rjsf-field-error-template text-red-600"
+                            >
+                              <ul
+                                class="list-disc list-inside"
+                              />
+                            </div>
+                            <div
+                              class="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
                           </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_name"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    name
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_name"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_name"
+                  >
+                    <span
+                      class="label-text font-medium"
+                    >
+                      name
+                    </span>
+                  </label>
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_name"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        name
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="input input-bordered"
+                      id="root_name"
+                      name="root.name"
+                      placeholder=""
+                      type="text"
+                      value="Test"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
                   >
-                    <span
-                      className="label-text"
-                    >
-                      name
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_name"
-                    name="root.name"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="Test"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_count"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    count
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_count"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_count"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       count
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_count__error root_count__description root_count__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_count"
-                    name="root.count"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={5}
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_count"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        count
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_count__error root_count__description root_count__help"
+                      class="input input-bordered"
+                      id="root_count"
+                      name="root.count"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="5"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-array"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-array"
-                disabled={false}
+                class="rjsf-field rjsf-field-array"
               >
                 <div
-                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                  class="field-template mb-3 rjsf-field rjsf-field-array"
                 >
                   <div
-                    className="title-field mb-6"
-                    id="root_items__title"
+                    class="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
                   >
-                    <h2
-                      className="text-3xl font-bold text-primary mb-2"
-                    >
-                      items
-                    </h2>
                     <div
-                      className="divider divider-primary my-0"
-                    />
-                  </div>
-                  <div
-                    className="flex flex-col gap-4"
-                  >
+                      class="title-field mb-6"
+                      id="root_items__title"
+                    >
+                      <h2
+                        class="text-3xl font-bold text-primary mb-2"
+                      >
+                        items
+                      </h2>
+                      <div
+                        class="divider divider-primary my-0"
+                      />
+                    </div>
                     <div
-                      className="rjsf-array-item-list"
+                      class="flex flex-col gap-4"
                     >
-                      <fieldset
-                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      <div
+                        class="rjsf-array-item-list"
                       >
-                        <div
-                          className="rjsf-field rjsf-field-string"
+                        <fieldset
+                          class="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
                         >
                           <div
-                            className="field-template mb-3 rjsf-field rjsf-field-string"
-                            disabled={false}
+                            class="rjsf-field rjsf-field-string"
                           >
-                            <label
-                              className="label"
-                              htmlFor="root_items_0"
-                            >
-                              <span
-                                className="label-text font-medium"
-                              >
-                                items-1
-                                <span
-                                  className="text-error ml-1"
-                                >
-                                  *
-                                </span>
-                              </span>
-                            </label>
                             <div
-                              className="form-control"
+                              class="field-template mb-3 rjsf-field rjsf-field-string"
                             >
                               <label
-                                className="label hidden"
-                                htmlFor="root_items_0"
-                                style={
-                                  {
-                                    "display": "none",
-                                  }
-                                }
+                                class="label"
+                                for="root_items_0"
                               >
                                 <span
-                                  className="label-text"
+                                  class="label-text font-medium"
                                 >
-                                  items-0
+                                  items-1
+                                  <span
+                                    class="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
                                 </span>
                               </label>
-                              <input
-                                aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                autoFocus={false}
-                                className="input input-bordered"
-                                disabled={false}
-                                id="root_items_0"
-                                name="root.items.0"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="a"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-error-template text-red-600"
-                            >
-                              <ul
-                                className="list-disc list-inside"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-help-template text-gray-500 text-sm"
-                            >
-                              <div />
+                              <div
+                                class="form-control"
+                              >
+                                <label
+                                  class="label hidden"
+                                  for="root_items_0"
+                                  style="display: none;"
+                                >
+                                  <span
+                                    class="label-text"
+                                  >
+                                    items-0
+                                  </span>
+                                </label>
+                                <input
+                                  aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                  class="input input-bordered"
+                                  id="root_items_0"
+                                  name="root.items.0"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="a"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-error-template text-red-600"
+                              >
+                                <ul
+                                  class="list-disc list-inside"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-help-template text-gray-500 text-sm"
+                              >
+                                <div />
+                              </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="flex justify-end mt-2"
-                        >
                           <div
-                            className="join"
+                            class="flex justify-end mt-2"
                           >
-                            <button
-                              aria-label="Move up"
-                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
-                              disabled={true}
-                              id="root_items_0__moveUp"
-                              onClick={[Function]}
-                              title="Move up"
-                              type="button"
+                            <div
+                              class="join"
                             >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-up h-5 w-5"
-                                data-icon="arrow-up"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
+                              <button
+                                aria-label="Move up"
+                                class="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled=""
+                                id="root_items_0__moveUp"
+                                title="Move up"
+                                type="button"
                               >
-                                <path
-                                  d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Move down"
-                              className="rjsf-array-item-move-down join-item btn btn-sm px-2"
-                              disabled={false}
-                              id="root_items_0__moveDown"
-                              onClick={[Function]}
-                              title="Move down"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-down h-5 w-5"
-                                data-icon="arrow-down"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-up h-5 w-5"
+                                  data-icon="arrow-up"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                class="rjsf-array-item-move-down join-item btn btn-sm px-2"
+                                id="root_items_0__moveDown"
+                                title="Move down"
+                                type="button"
                               >
-                                <path
-                                  d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Remove"
-                              className="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
-                              disabled={false}
-                              id="root_items_0__remove"
-                              onClick={[Function]}
-                              title="Remove"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-trash h-5 w-5"
-                                data-icon="trash"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 448 512"
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-down h-5 w-5"
+                                  data-icon="arrow-down"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                class="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
+                                id="root_items_0__remove"
+                                title="Remove"
+                                type="button"
                               >
-                                <path
-                                  d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-trash h-5 w-5"
+                                  data-icon="trash"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 448 512"
+                                >
+                                  <path
+                                    d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
                           </div>
-                        </div>
-                      </fieldset>
-                      <fieldset
-                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
-                      >
-                        <div
-                          className="rjsf-field rjsf-field-string"
+                        </fieldset>
+                        <fieldset
+                          class="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
                         >
                           <div
-                            className="field-template mb-3 rjsf-field rjsf-field-string"
-                            disabled={false}
+                            class="rjsf-field rjsf-field-string"
                           >
-                            <label
-                              className="label"
-                              htmlFor="root_items_1"
-                            >
-                              <span
-                                className="label-text font-medium"
-                              >
-                                items-2
-                                <span
-                                  className="text-error ml-1"
-                                >
-                                  *
-                                </span>
-                              </span>
-                            </label>
                             <div
-                              className="form-control"
+                              class="field-template mb-3 rjsf-field rjsf-field-string"
                             >
                               <label
-                                className="label hidden"
-                                htmlFor="root_items_1"
-                                style={
-                                  {
-                                    "display": "none",
-                                  }
-                                }
+                                class="label"
+                                for="root_items_1"
                               >
                                 <span
-                                  className="label-text"
+                                  class="label-text font-medium"
                                 >
-                                  items-1
+                                  items-2
+                                  <span
+                                    class="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
                                 </span>
                               </label>
-                              <input
-                                aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                autoFocus={false}
-                                className="input input-bordered"
-                                disabled={false}
-                                id="root_items_1"
-                                name="root.items.1"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="b"
-                              />
-                            </div>
-                            <div
-                              className="rjsf-field-error-template text-red-600"
-                            >
-                              <ul
-                                className="list-disc list-inside"
-                              />
+                              <div
+                                class="form-control"
+                              >
+                                <label
+                                  class="label hidden"
+                                  for="root_items_1"
+                                  style="display: none;"
+                                >
+                                  <span
+                                    class="label-text"
+                                  >
+                                    items-1
+                                  </span>
+                                </label>
+                                <input
+                                  aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                  class="input input-bordered"
+                                  id="root_items_1"
+                                  name="root.items.1"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="b"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-error-template text-red-600"
+                              >
+                                <ul
+                                  class="list-disc list-inside"
+                                />
+                              </div>
+                              <div
+                                class="rjsf-field-help-template text-gray-500 text-sm"
+                              >
+                                <div />
+                              </div>
                             </div>
+                          </div>
+                          <div
+                            class="flex justify-end mt-2"
+                          >
                             <div
-                              className="rjsf-field-help-template text-gray-500 text-sm"
+                              class="join"
                             >
-                              <div />
+                              <button
+                                aria-label="Move up"
+                                class="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                id="root_items_1__moveUp"
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-up h-5 w-5"
+                                  data-icon="arrow-up"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                class="rjsf-array-item-move-down join-item btn btn-sm px-2"
+                                disabled=""
+                                id="root_items_1__moveDown"
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-arrow-down h-5 w-5"
+                                  data-icon="arrow-down"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 384 512"
+                                >
+                                  <path
+                                    d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                class="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
+                                id="root_items_1__remove"
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  class="svg-inline--fa fa-trash h-5 w-5"
+                                  data-icon="trash"
+                                  data-prefix="fas"
+                                  role="img"
+                                  viewBox="0 0 448 512"
+                                >
+                                  <path
+                                    d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                    fill="currentColor"
+                                  />
+                                </svg>
+                              </button>
                             </div>
                           </div>
-                        </div>
+                        </fieldset>
+                      </div>
+                      <div
+                        class="flex justify-end"
+                      >
                         <div
-                          className="flex justify-end mt-2"
+                          class="row"
                         >
-                          <div
-                            className="join"
+                          <p
+                            class="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add btn btn-primary btn-sm"
                           >
                             <button
-                              aria-label="Move up"
-                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
-                              disabled={false}
-                              id="root_items_1__moveUp"
-                              onClick={[Function]}
-                              title="Move up"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-up h-5 w-5"
-                                data-icon="arrow-up"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
-                              >
-                                <path
-                                  d="M214.6 17.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 117.3 160 488c0 17.7 14.3 32 32 32s32-14.3 32-32l0-370.7 105.4 105.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Move down"
-                              className="rjsf-array-item-move-down join-item btn btn-sm px-2"
-                              disabled={true}
-                              id="root_items_1__moveDown"
-                              onClick={[Function]}
-                              title="Move down"
-                              type="button"
-                            >
-                              <svg
-                                aria-hidden="true"
-                                className="svg-inline--fa fa-arrow-down h-5 w-5"
-                                data-icon="arrow-down"
-                                data-prefix="fas"
-                                role="img"
-                                viewBox="0 0 384 512"
-                              >
-                                <path
-                                  d="M169.4 502.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 402.7 224 32c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 370.7-105.4-105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z"
-                                  fill="currentColor"
-                                />
-                              </svg>
-                            </button>
-                            <button
-                              aria-label="Remove"
-                              className="rjsf-array-item-remove join-item btn btn-sm btn-error px-2"
-                              disabled={false}
-                              id="root_items_1__remove"
-                              onClick={[Function]}
-                              title="Remove"
+                              aria-label="Add"
+                              class="btn-add col-xs-12 btn-primary btn-primary-content"
+                              id="root_items__add"
+                              title="Add"
                               type="button"
                             >
                               <svg
                                 aria-hidden="true"
-                                className="svg-inline--fa fa-trash h-5 w-5"
-                                data-icon="trash"
+                                class="svg-inline--fa fa-plus h-5 w-5"
+                                data-icon="plus"
                                 data-prefix="fas"
                                 role="img"
                                 viewBox="0 0 448 512"
                               >
                                 <path
-                                  d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                                  d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                                   fill="currentColor"
                                 />
                               </svg>
                             </button>
-                          </div>
+                          </p>
                         </div>
-                      </fieldset>
-                    </div>
-                    <div
-                      className="flex justify-end"
-                    >
-                      <div
-                        className="row"
-                      >
-                        <p
-                          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add btn btn-primary btn-sm"
-                        >
-                          <button
-                            aria-label="Add"
-                            className="btn-add col-xs-12 btn-primary btn-primary-content"
-                            disabled={false}
-                            id="root_items__add"
-                            onClick={[Function]}
-                            title="Add"
-                            type="button"
-                          >
-                            <svg
-                              aria-hidden="true"
-                              className="svg-inline--fa fa-plus h-5 w-5"
-                              data-icon="plus"
-                              data-prefix="fas"
-                              role="img"
-                              viewBox="0 0 448 512"
-                            >
-                              <path
-                                d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                                fill="currentColor"
-                              />
-                            </svg>
-                          </button>
-                        </p>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_firstName"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    firstName
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_firstName"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_firstName"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       firstName
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root.firstName"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_firstName"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        firstName
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      class="input input-bordered"
+                      id="root_firstName"
+                      name="root.firstName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_lastName"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    lastName
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_lastName"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_lastName"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       lastName
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root.lastName"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_lastName"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        lastName
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                      class="input input-bordered"
+                      id="root_lastName"
+                      name="root.lastName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_age"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    age
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_age"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_age"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       age
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_age"
-                    name="root.age"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_age"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        age
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="input input-bordered"
+                      id="root_age"
+                      name="root.age"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_foo-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      foo Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_foo"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      foo
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_foo"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_foo-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        foo
+                        foo Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_foo-key"
                       type="text"
                       value="foo"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_foo"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_foo"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          foo
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        class="input input-bordered"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_foo__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_foo__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_a"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    A
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_a"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_a"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       A
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_a"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        A
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="input input-bordered"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_b"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    B
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_b"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_b"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       B
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_b"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        B
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="input input-bordered"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      additionalProperty Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      additionalProperty
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_additionalProperty"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_additionalProperty-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        additionalProperty
+                        additionalProperty Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_additionalProperty"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        additionalProperty
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_additionalProperty"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          additionalProperty
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        class="input input-bordered"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_additionalProperty__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_additionalProperty__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            Test field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              Test field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a test description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a test description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_foo-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      foo Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_foo"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      foo
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_foo"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_foo-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        foo
+                        foo Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_foo-key"
                       type="text"
                       value="foo"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_foo"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_foo"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          foo
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        class="input input-bordered"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_foo__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_foo__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            My Field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              My Field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a fancier description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a fancier description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_foo-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      foo Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_foo"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      foo
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_foo"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_foo-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        foo
+                        foo Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_foo-key"
                       type="text"
                       value="foo"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_foo"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_foo"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          foo
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        class="input input-bordered"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_foo__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_foo__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            My Field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              My Field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a fancier description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a fancier description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_a"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    My Item A
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_a"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_a"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       My Item A
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_a"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        My Item A
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="input input-bordered"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_b"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    My Item B
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_b"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_b"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       My Item B
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_b"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        My Item B
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="input input-bordered"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            My Field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              My Field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a fancier description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a fancier description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_foo-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      foo Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_foo"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      foo
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_foo"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_foo-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        foo
+                        foo Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_foo-key"
                       type="text"
                       value="foo"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_foo"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_foo"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          foo
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        class="input input-bordered"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_foo__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_foo__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            My Field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              My Field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a fancier description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a fancier description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_a"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    My Item A
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_a"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_a"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       My Item A
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_a"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        My Item A
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="input input-bordered"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_b"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    My Item B
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_b"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_b"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       My Item B
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_b"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        My Item B
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="input input-bordered"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            My Field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              My Field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a fancier description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a fancier description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      additionalProperty Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty"
-                  >
-                    <span
-                      className="label-text font-medium"
-                    >
-                      additionalProperty
-                    </span>
-                  </label>
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_additionalProperty"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_additionalProperty-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        additionalProperty
+                        additionalProperty Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <label
+                      class="label"
+                      for="root_additionalProperty"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        additionalProperty
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_additionalProperty"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          additionalProperty
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        class="input input-bordered"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_additionalProperty__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_additionalProperty__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            Test field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              Test field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a test description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a test description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="label"
-                  htmlFor="root_a"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    A
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_a"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_a"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       A
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_a"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        A
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="input input-bordered"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="label"
-                  htmlFor="root_b"
-                >
-                  <span
-                    className="label-text font-medium"
-                  >
-                    B
-                  </span>
-                </label>
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
                   <label
-                    className="label hidden"
-                    htmlFor="root_b"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                    class="label"
+                    for="root_b"
                   >
                     <span
-                      className="label-text"
+                      class="label-text font-medium"
                     >
                       B
                     </span>
                   </label>
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                  <div
+                    class="form-control"
+                  >
+                    <label
+                      class="label hidden"
+                      for="root_b"
+                      style="display: none;"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        B
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="input input-bordered"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="title-field mb-6"
-          id="root__title"
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
-          <h2
-            className="text-3xl font-bold text-primary mb-2"
-          >
-            Test field
-          </h2>
           <div
-            className="divider divider-primary my-0"
-          />
-        </div>
-        <div
-          className="description-field my-4"
-          id="root__description"
-        >
+            class="title-field mb-6"
+            id="root__title"
+          >
+            <h2
+              class="text-3xl font-bold text-primary mb-2"
+            >
+              Test field
+            </h2>
+            <div
+              class="divider divider-primary my-0"
+            />
+          </div>
           <div
-            className="text-sm text-base-content/80"
+            class="description-field my-4"
+            id="root__description"
           >
-            a test description
+            <div
+              class="text-sm text-base-content/80"
+            >
+              a test description
+            </div>
           </div>
-        </div>
-        <div
-          className="grid grid-cols-1 gap-3 "
-        >
           <div
-            className=""
+            class="grid grid-cols-1 gap-3 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      additionalProperty Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty"
+                  <div>
+                    <label
+                      class="label"
+                      for="root_additionalProperty-key"
+                    >
+                      <span
+                        class="label-text"
+                      >
+                        additionalProperty Key
+                      </span>
+                    </label>
+                    <input
+                      class="input input-bordered"
+                      id="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </div>
+                  <div
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <span
-                      className="label-text font-medium"
+                    <label
+                      class="label"
+                      for="root_additionalProperty"
+                    >
+                      <span
+                        class="label-text font-medium"
+                      >
+                        additionalProperty
+                      </span>
+                    </label>
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_additionalProperty"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          additionalProperty
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        class="input input-bordered"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
                     >
-                      additionalProperty
-                    </span>
-                  </label>
+                      <div />
+                    </div>
+                  </div>
                   <div
-                    className="form-control"
+                    class="flex self-center"
                   >
-                    <label
-                      className="label hidden"
-                      htmlFor="root_additionalProperty"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_additionalProperty__remove"
+                      title="Remove"
+                      type="button"
                     >
-                      <span
-                        className="label-text"
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
                       >
-                        additionalProperty
-                      </span>
-                    </label>
-                    <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="should appear"
-                    />
-                  </div>
-                  <div
-                    className="rjsf-field-error-template text-red-600"
-                  >
-                    <ul
-                      className="list-disc list-inside"
-                    />
-                  </div>
-                  <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
-                  >
-                    <div />
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_additionalProperty__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_foo-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      foo Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_foo"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_foo-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        foo
+                        foo Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_foo-key"
                       type="text"
                       value="foo"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_foo"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          foo
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        class="input input-bordered"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_foo__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_foo__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-string"
-                disabled={false}
+                class="rjsf-field rjsf-field-string"
               >
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-string"
                 >
-                  <label
-                    className="label hidden"
-                    htmlFor="root_a"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                  <div
+                    class="form-control"
                   >
-                    <span
-                      className="label-text"
+                    <label
+                      class="label hidden"
+                      for="root_a"
+                      style="display: none;"
                     >
-                      A
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                      <span
+                        class="label-text"
+                      >
+                        A
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="input input-bordered"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className=""
-          >
             <div
-              className="rjsf-field rjsf-field-number"
+              class=""
             >
               <div
-                className="field-template mb-3 rjsf-field rjsf-field-number"
-                disabled={false}
+                class="rjsf-field rjsf-field-number"
               >
                 <div
-                  className="form-control"
+                  class="field-template mb-3 rjsf-field rjsf-field-number"
                 >
-                  <label
-                    className="label hidden"
-                    htmlFor="root_b"
-                    style={
-                      {
-                        "display": "none",
-                      }
-                    }
+                  <div
+                    class="form-control"
                   >
-                    <span
-                      className="label-text"
+                    <label
+                      class="label hidden"
+                      for="root_b"
+                      style="display: none;"
                     >
-                      B
-                    </span>
-                  </label>
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="input input-bordered"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <div
-                  className="rjsf-field-error-template text-red-600"
-                >
-                  <ul
-                    className="list-disc list-inside"
-                  />
-                </div>
-                <div
-                  className="rjsf-field-help-template text-gray-500 text-sm"
-                >
-                  <div />
+                      <span
+                        class="label-text"
+                      >
+                        B
+                      </span>
+                    </label>
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="input input-bordered"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-error-template text-red-600"
+                  >
+                    <ul
+                      class="list-disc list-inside"
+                    />
+                  </div>
+                  <div
+                    class="rjsf-field-help-template text-gray-500 text-sm"
+                  >
+                    <div />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
         </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
+        </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="field-template mb-3 rjsf-field rjsf-field-object"
-      disabled={false}
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+        class="field-template mb-3 rjsf-field rjsf-field-object"
       >
         <div
-          className="grid grid-cols-1 gap-4 "
+          class="form-control bg-base-100 p-6 rounded-xl shadow-lg"
         >
           <div
-            className=""
+            class="grid grid-cols-1 gap-4 "
           >
             <div
-              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+              class=""
             >
               <div
-                className="flex items-baseline"
-                style={
-                  {
-                    "justifyContent": "space-between",
-                  }
-                }
+                class="wrap-if-additional-template rjsf-field rjsf-field-string"
               >
-                <div>
-                  <label
-                    className="label"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    <span
-                      className="label-text"
-                    >
-                      additionalProperty Key
-                    </span>
-                  </label>
-                  <input
-                    className="input input-bordered"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    type="text"
-                  />
-                </div>
                 <div
-                  className="field-template mb-3 rjsf-field rjsf-field-string"
-                  disabled={false}
+                  class="flex items-baseline"
+                  style="justify-content: space-between;"
                 >
-                  <div
-                    className="form-control"
-                  >
+                  <div>
                     <label
-                      className="label hidden"
-                      htmlFor="root_additionalProperty"
-                      style={
-                        {
-                          "display": "none",
-                        }
-                      }
+                      class="label"
+                      for="root_additionalProperty-key"
                     >
                       <span
-                        className="label-text"
+                        class="label-text"
                       >
-                        additionalProperty
+                        additionalProperty Key
                       </span>
                     </label>
                     <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      className="input input-bordered"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      class="input input-bordered"
+                      id="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                   </div>
                   <div
-                    className="rjsf-field-error-template text-red-600"
+                    class="field-template mb-3 rjsf-field rjsf-field-string"
                   >
-                    <ul
-                      className="list-disc list-inside"
-                    />
+                    <div
+                      class="form-control"
+                    >
+                      <label
+                        class="label hidden"
+                        for="root_additionalProperty"
+                        style="display: none;"
+                      >
+                        <span
+                          class="label-text"
+                        >
+                          additionalProperty
+                        </span>
+                      </label>
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        class="input input-bordered"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-error-template text-red-600"
+                    >
+                      <ul
+                        class="list-disc list-inside"
+                      />
+                    </div>
+                    <div
+                      class="rjsf-field-help-template text-gray-500 text-sm"
+                    >
+                      <div />
+                    </div>
                   </div>
                   <div
-                    className="rjsf-field-help-template text-gray-500 text-sm"
+                    class="flex self-center"
                   >
-                    <div />
+                    <button
+                      aria-label="Remove"
+                      class="rjsf-object-property-remove"
+                      id="root_additionalProperty__remove"
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        class="svg-inline--fa fa-trash h-5 w-5"
+                        data-icon="trash"
+                        data-prefix="fas"
+                        role="img"
+                        viewBox="0 0 448 512"
+                      >
+                        <path
+                          d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </button>
                   </div>
                 </div>
-                <div
-                  className="flex self-center"
+              </div>
+            </div>
+            <div
+              class="flex justify-end"
+            >
+              <div
+                class="row"
+              >
+                <p
+                  class="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
                 >
                   <button
-                    aria-label="Remove"
-                    className="rjsf-object-property-remove"
-                    disabled={false}
-                    id="root_additionalProperty__remove"
-                    onClick={[Function]}
-                    title="Remove"
+                    aria-label="Add"
+                    class="btn-add col-xs-12 btn-primary btn-primary-content"
+                    id="root__add"
+                    title="Add"
                     type="button"
                   >
                     <svg
                       aria-hidden="true"
-                      className="svg-inline--fa fa-trash h-5 w-5"
-                      data-icon="trash"
+                      class="svg-inline--fa fa-plus h-5 w-5"
+                      data-icon="plus"
                       data-prefix="fas"
                       role="img"
                       viewBox="0 0 448 512"
                     >
                       <path
-                        d="M136.7 5.9L128 32 32 32C14.3 32 0 46.3 0 64S14.3 96 32 96l384 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-96 0-8.7-26.1C306.9-7.2 294.7-16 280.9-16L167.1-16c-13.8 0-26 8.8-30.4 21.9zM416 144L32 144 53.1 467.1C54.7 492.4 75.7 512 101 512L347 512c25.3 0 46.3-19.6 47.9-44.9L416 144z"
+                        d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
                         fill="currentColor"
                       />
                     </svg>
                   </button>
-                </div>
+                </p>
               </div>
             </div>
           </div>
-          <div
-            className="flex justify-end"
-          >
-            <div
-              className="row"
-            >
-              <p
-                className="col-xs-3 col-xs-offset-9 text-right rjsf-object-property-expand btn btn-primary btn-sm"
-              >
-                <button
-                  aria-label="Add"
-                  className="btn-add col-xs-12 btn-primary btn-primary-content"
-                  disabled={false}
-                  id="root__add"
-                  onClick={[Function]}
-                  title="Add"
-                  type="button"
-                >
-                  <svg
-                    aria-hidden="true"
-                    className="svg-inline--fa fa-plus h-5 w-5"
-                    data-icon="plus"
-                    data-prefix="fas"
-                    role="img"
-                    viewBox="0 0 448 512"
-                  >
-                    <path
-                      d="M256 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 160-160 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l160 0 0 160c0 17.7 14.3 32 32 32s32-14.3 32-32l0-160 160 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-160 0 0-160z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </button>
-              </p>
-            </div>
-          </div>
+        </div>
+        <div
+          class="rjsf-field-error-template text-red-600"
+        >
+          <ul
+            class="list-disc list-inside"
+          />
+        </div>
+        <div
+          class="rjsf-field-help-template text-gray-500 text-sm"
+        >
+          <div />
         </div>
       </div>
-      <div
-        className="rjsf-field-error-template text-red-600"
-      >
-        <ul
-          className="list-disc list-inside"
-        />
-      </div>
-      <div
-        className="rjsf-field-help-template text-gray-500 text-sm"
+    </div>
+    <div>
+      <button
+        class="btn btn-primary btn-primary-content "
+        type="submit"
       >
-        <div />
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary btn-primary-content "
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap b/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
index e6195d6987..30eed55a1e 100644
--- a/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
@@ -1,259 +1,203 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-object"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                className="___12hmf4e_0000000 f2zxqi febqm8h"
-                id="root_person__title"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <h5
-                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                  style={
-                    {
-                      "marginBlock": 0,
-                    }
-                  }
-                >
-                  person
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                  role="separator"
-                />
-              </div>
-              <div
-                className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-              >
+                  class="___12hmf4e_0000000 f2zxqi febqm8h"
+                  id="root_person__title"
+                >
+                  <h5
+                    class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                    style="margin-block: 0;"
+                  >
+                    person
+                  </h5>
+                  <div
+                    aria-orientation="horizontal"
+                    class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                    role="separator"
+                  />
+                </div>
                 <div
-                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
+                  class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
                 >
                   <div
-                    className="rjsf-field rjsf-field-string"
+                    class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      class="rjsf-field rjsf-field-string"
                     >
-                      <label
-                        className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                        htmlFor="root_person_name"
-                      >
-                        name
-                      </label>
-                      <span
-                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      <div
+                        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                       >
-                        <input
-                          aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                          autoFocus={false}
-                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                          disabled={false}
-                          id="root_person_name"
-                          name="root[person][name]"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
-                          placeholder=""
-                          required={false}
-                          type="text"
-                          value=""
-                        />
-                      </span>
+                        <label
+                          class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          for="root_person_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                            class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            id="root_person_name"
+                            name="root[person][name]"
+                            placeholder=""
+                            type="text"
+                            value=""
+                          />
+                        </span>
+                      </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
-                >
                   <div
-                    className="rjsf-field rjsf-field-object"
+                    class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      class="rjsf-field rjsf-field-object"
                     >
                       <div
-                        className="___12hmf4e_0000000 f2zxqi febqm8h"
-                        id="root_person_address__title"
+                        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                       >
-                        <h5
-                          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                          style={
-                            {
-                              "marginBlock": 0,
-                            }
-                          }
-                        >
-                          address
-                        </h5>
                         <div
-                          aria-orientation="horizontal"
-                          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                          role="separator"
-                        />
-                      </div>
-                      <div
-                        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-                      >
+                          class="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_person_address__title"
+                        >
+                          <h5
+                            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style="margin-block: 0;"
+                          >
+                            address
+                          </h5>
+                          <div
+                            aria-orientation="horizontal"
+                            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                            role="separator"
+                          />
+                        </div>
                         <div
-                          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
+                          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
                         >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              class="rjsf-field rjsf-field-string"
                             >
-                              <label
-                                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                                htmlFor="root_person_address_street"
+                              <div
+                                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                               >
-                                street
-                              </label>
-                              <span
-                                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                              >
-                                <input
-                                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                  autoFocus={false}
-                                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                                  disabled={false}
-                                  id="root_person_address_street"
-                                  name="root[person][address][street]"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  placeholder=""
-                                  required={false}
-                                  type="text"
-                                  value=""
-                                />
-                              </span>
+                                <label
+                                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                                  for="root_person_address_street"
+                                >
+                                  street
+                                </label>
+                                <span
+                                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    id="root_person_address_street"
+                                    name="root[person][address][street]"
+                                    placeholder=""
+                                    type="text"
+                                    value=""
+                                  />
+                                </span>
+                              </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              class="rjsf-field rjsf-field-string"
                             >
-                              <label
-                                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                                htmlFor="root_person_address_city"
+                              <div
+                                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                               >
-                                city
-                              </label>
-                              <span
-                                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                              >
-                                <input
-                                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                  autoFocus={false}
-                                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                                  disabled={false}
-                                  id="root_person_address_city"
-                                  name="root[person][address][city]"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  placeholder=""
-                                  required={false}
-                                  type="text"
-                                  value=""
-                                />
-                              </span>
+                                <label
+                                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                                  for="root_person_address_city"
+                                >
+                                  city
+                                </label>
+                                <span
+                                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    id="root_person_address_city"
+                                    name="root[person][address][city]"
+                                    placeholder=""
+                                    type="text"
+                                    value=""
+                                  />
+                                </span>
+                              </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              class="rjsf-field rjsf-field-string"
                             >
-                              <label
-                                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                                htmlFor="root_person_address_country"
+                              <div
+                                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                               >
-                                country
-                              </label>
-                              <span
-                                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                              >
-                                <input
-                                  aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                  autoFocus={false}
-                                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                                  disabled={false}
-                                  id="root_person_address_country"
-                                  name="root[person][address][country]"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  placeholder=""
-                                  required={false}
-                                  type="text"
-                                  value=""
-                                />
-                              </span>
+                                <label
+                                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                                  for="root_person_address_country"
+                                >
+                                  country
+                                </label>
+                                <span
+                                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    id="root_person_address_country"
+                                    name="root[person][address][country]"
+                                    placeholder=""
+                                    type="text"
+                                    value=""
+                                  />
+                                </span>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -267,503 +211,618 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_name"
-              >
-                name
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_name"
-                  name="root[name]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value="John"
-                />
-              </span>
-            </div>
-          </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
-          >
-            <div>
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r21__control"
-                  id="field-r21__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_name"
                 >
-                  customField Key
+                  name
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-r21__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_customField-key"
-                    name="root_customField-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_name"
+                    name="root[name]"
+                    placeholder=""
                     type="text"
-                    value="customField"
+                    value="John"
                   />
                 </span>
               </div>
             </div>
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_customField"
-                >
-                  customField
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            >
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-describedby="root_customField__error root_customField__description root_customField__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_customField"
-                    name="root[customField]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="customValue"
-                  />
-                </span>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r21__control"
+                    id="field-r21__label"
+                  >
+                    customField Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r21__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_customField-key"
+                      name="root_customField-key"
+                      type="text"
+                      value="customField"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_customField__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_customField"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
+                    customField
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_customField__error root_customField__description root_customField__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_customField"
+                      name="root[customField]"
+                      placeholder=""
+                      type="text"
+                      value="customValue"
                     />
-                  </svg>
-                </span>
-              </button>
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_customField__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
+          <div
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <span
-              className="fui-Button__icon rywnvv2"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                class="fui-Button__icon rywnvv2"
               >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                   fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_name"
-              >
-                name
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_name"
-                  name="root[name]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value="Alice"
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_name"
+                >
+                  name
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_name"
+                    name="root[name]"
+                    placeholder=""
+                    type="text"
+                    value="Alice"
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-number"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_age"
-              >
-                age
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_age"
-                  name="root[age]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value={30}
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_age"
+                >
+                  age
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_age"
+                    name="root[age]"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value="30"
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-boolean"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-boolean"
             >
-              <span
-                className="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_active__error root_active__description root_active__help"
-                  autoFocus={false}
-                  checked={true}
-                  className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
-                  disabled={false}
-                  id="root_active"
-                  name="root[active]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  required={false}
-                  type="checkbox"
-                />
-                <div
-                  aria-hidden={true}
-                  className="fui-Checkbox__indicator rl7ci6d"
+                <span
+                  class="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="12"
-                    viewBox="0 0 12 12"
-                    width="12"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <input
+                    aria-describedby="root_active__error root_active__description root_active__help"
+                    checked=""
+                    class="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                    id="root_active"
+                    name="root[active]"
+                    type="checkbox"
+                  />
+                  <div
+                    aria-hidden="true"
+                    class="fui-Checkbox__indicator rl7ci6d"
                   >
-                    <path
-                      d="M9.76 3.2c.3.29.32.76.04 1.06l-4.25 4.5a.75.75 0 0 1-1.08.02L2.22 6.53a.75.75 0 0 1 1.06-1.06l1.7 1.7L8.7 3.24a.75.75 0 0 1 1.06-.04Z"
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                       fill="currentColor"
-                    />
-                  </svg>
-                </div>
-                <label
-                  className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
-                  htmlFor="root_active"
-                >
-                  active
-                </label>
-              </span>
+                      height="12"
+                      viewBox="0 0 12 12"
+                      width="12"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M9.76 3.2c.3.29.32.76.04 1.06l-4.25 4.5a.75.75 0 0 1-1.08.02L2.22 6.53a.75.75 0 0 1 1.06-1.06l1.7 1.7L8.7 3.24a.75.75 0 0 1 1.06-.04Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </div>
+                  <label
+                    class="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    for="root_active"
+                  >
+                    active
+                  </label>
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-array"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-array"
             >
               <div
-                className="___12hmf4e_0000000 f2zxqi febqm8h"
-                id="root_tags__title"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <h5
-                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                  style={
-                    {
-                      "marginBlock": 0,
-                    }
-                  }
-                >
-                  tags
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                  role="separator"
-                />
-              </div>
-              <div
-                className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
-              >
+                  class="___12hmf4e_0000000 f2zxqi febqm8h"
+                  id="root_tags__title"
+                >
+                  <h5
+                    class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                    style="margin-block: 0;"
+                  >
+                    tags
+                  </h5>
+                  <div
+                    aria-orientation="horizontal"
+                    class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                    role="separator"
+                  />
+                </div>
                 <div
-                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+                  class="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
                 >
                   <div
-                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                    class="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
                     >
                       <div
-                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                        class="rjsf-field rjsf-field-string"
                       >
-                        <label
-                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                          htmlFor="root_tags_0"
+                        <div
+                          class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                         >
-                          tags-0
+                          <label
+                            class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                            for="root_tags_0"
+                          >
+                            tags-0
+                            <span
+                              aria-hidden="true"
+                              class="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            >
+                              *
+                            </span>
+                          </label>
                           <span
-                            aria-hidden="true"
-                            className="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                           >
-                            *
+                            <input
+                              aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                              class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              id="root_tags_0"
+                              name="root[tags][0]"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="developer"
+                            />
                           </span>
-                        </label>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      class="fui-Flex ___1gzszts_10anl4a f22iagw"
+                      style="margin-left: 8px;"
+                    >
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-up ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
+                        disabled=""
+                        id="root_tags_0__moveUp"
+                        title="Move up"
+                        type="button"
+                      >
                         <span
-                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <input
-                            aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                            autoFocus={false}
-                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                            disabled={false}
-                            id="root_tags_0"
-                            name="root[tags][0]"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="developer"
-                          />
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-down ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_tags_0__moveDown"
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_tags_0__remove"
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                              fill="currentColor"
+                            />
+                          </svg>
                         </span>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    class="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+                  >
+                    <div
+                      class="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                    >
+                      <div
+                        class="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                        >
+                          <label
+                            class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                            for="root_tags_1"
+                          >
+                            tags-1
+                            <span
+                              aria-hidden="true"
+                              class="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            >
+                              *
+                            </span>
+                          </label>
+                          <span
+                            class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                          >
+                            <input
+                              aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                              class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              id="root_tags_1"
+                              name="root[tags][1]"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="designer"
+                            />
+                          </span>
+                        </div>
                       </div>
                     </div>
+                    <div
+                      class="fui-Flex ___1gzszts_10anl4a f22iagw"
+                      style="margin-left: 8px;"
+                    >
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-up ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_tags_1__moveUp"
+                        title="Move up"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-down ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
+                        disabled=""
+                        id="root_tags_1__moveDown"
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_tags_1__remove"
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                    </div>
                   </div>
                   <div
-                    className="fui-Flex ___1gzszts_10anl4a f22iagw"
-                    style={
-                      {
-                        "marginLeft": "8px",
-                      }
-                    }
+                    class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
                   >
                     <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-up ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
-                      disabled={true}
-                      id="root_tags_0__moveUp"
-                      onClick={[Function]}
-                      title="Move up"
+                      class="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      id="root_tags__add"
+                      title="Add Item"
                       type="button"
                     >
                       <span
-                        className="fui-Button__icon rywnvv2"
+                        class="fui-Button__icon rywnvv2"
                       >
                         <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                          aria-hidden="true"
+                          class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                           fill="currentColor"
                           height="1em"
                           viewBox="0 0 20 20"
@@ -771,198 +830,7 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                           xmlns="http://www.w3.org/2000/svg"
                         >
                           <path
-                            d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-down ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_tags_0__moveDown"
-                      onClick={[Function]}
-                      title="Move down"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_tags_0__remove"
-                      onClick={[Function]}
-                      title="Remove"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                  </div>
-                </div>
-                <div
-                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
-                >
-                  <div
-                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
-                  >
-                    <div
-                      className="rjsf-field rjsf-field-string"
-                    >
-                      <div
-                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-                      >
-                        <label
-                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                          htmlFor="root_tags_1"
-                        >
-                          tags-1
-                          <span
-                            aria-hidden="true"
-                            className="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
-                          >
-                            *
-                          </span>
-                        </label>
-                        <span
-                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                        >
-                          <input
-                            aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                            autoFocus={false}
-                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                            disabled={false}
-                            id="root_tags_1"
-                            name="root[tags][1]"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="designer"
-                          />
-                        </span>
-                      </div>
-                    </div>
-                  </div>
-                  <div
-                    className="fui-Flex ___1gzszts_10anl4a f22iagw"
-                    style={
-                      {
-                        "marginLeft": "8px",
-                      }
-                    }
-                  >
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-up ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_tags_1__moveUp"
-                      onClick={[Function]}
-                      title="Move up"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-down ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
-                      disabled={true}
-                      id="root_tags_1__moveDown"
-                      onClick={[Function]}
-                      title="Move down"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
-                            fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_tags_1__remove"
-                      onClick={[Function]}
-                      title="Remove"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
-                        >
-                          <path
-                            d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                            d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
                             fill="currentColor"
                           />
                         </svg>
@@ -970,431 +838,320 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                     </button>
                   </div>
                 </div>
-                <div
-                  className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-                >
-                  <button
-                    className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                    disabled={false}
-                    id="root_tags__add"
-                    onClick={[Function]}
-                    title="Add Item"
-                    type="button"
-                  >
-                    <span
-                      className="fui-Button__icon rywnvv2"
-                    >
-                      <svg
-                        aria-hidden={true}
-                        className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                        fill="currentColor"
-                        height="1em"
-                        viewBox="0 0 20 20"
-                        width="1em"
-                        xmlns="http://www.w3.org/2000/svg"
-                      >
-                        <path
-                          d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                          fill="currentColor"
-                        />
-                      </svg>
-                    </span>
-                  </button>
-                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_firstName"
-              >
-                firstName
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_firstName"
-                  name="root[firstName]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_firstName"
+                >
+                  firstName
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_firstName"
+                    name="root[firstName]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_lastName"
-              >
-                lastName
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_lastName"
-                  name="root[lastName]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_lastName"
+                >
+                  lastName
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_lastName"
+                    name="root[lastName]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-number"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_age"
-              >
-                age
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_age"
-                  name="root[age]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_age"
+                >
+                  age
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_age"
+                    name="root[age]"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value=""
+                  />
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-object"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                className="___12hmf4e_0000000 f2zxqi febqm8h"
-                id="root_person__title"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <h5
-                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                  style={
-                    {
-                      "marginBlock": 0,
-                    }
-                  }
-                >
-                  person
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                  role="separator"
-                />
-              </div>
-              <div
-                className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-              >
+                  class="___12hmf4e_0000000 f2zxqi febqm8h"
+                  id="root_person__title"
+                >
+                  <h5
+                    class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                    style="margin-block: 0;"
+                  >
+                    person
+                  </h5>
+                  <div
+                    aria-orientation="horizontal"
+                    class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                    role="separator"
+                  />
+                </div>
                 <div
-                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
+                  class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
                 >
                   <div
-                    className="rjsf-field rjsf-field-string"
+                    class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      class="rjsf-field rjsf-field-string"
                     >
-                      <label
-                        className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                        htmlFor="root_person_name"
-                      >
-                        name
-                      </label>
-                      <span
-                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      <div
+                        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                       >
-                        <input
-                          aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                          autoFocus={false}
-                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                          disabled={false}
-                          id="root_person_name"
-                          name="root.person.name"
-                          onBlur={[Function]}
-                          onChange={[Function]}
-                          onFocus={[Function]}
-                          placeholder=""
-                          required={false}
-                          type="text"
-                          value=""
-                        />
-                      </span>
+                        <label
+                          class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          for="root_person_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                            class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            id="root_person_name"
+                            name="root.person.name"
+                            placeholder=""
+                            type="text"
+                            value=""
+                          />
+                        </span>
+                      </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
-                >
                   <div
-                    className="rjsf-field rjsf-field-object"
+                    class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      class="rjsf-field rjsf-field-object"
                     >
                       <div
-                        className="___12hmf4e_0000000 f2zxqi febqm8h"
-                        id="root_person_address__title"
+                        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                       >
-                        <h5
-                          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                          style={
-                            {
-                              "marginBlock": 0,
-                            }
-                          }
-                        >
-                          address
-                        </h5>
                         <div
-                          aria-orientation="horizontal"
-                          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                          role="separator"
-                        />
-                      </div>
-                      <div
-                        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-                      >
+                          class="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_person_address__title"
+                        >
+                          <h5
+                            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style="margin-block: 0;"
+                          >
+                            address
+                          </h5>
+                          <div
+                            aria-orientation="horizontal"
+                            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                            role="separator"
+                          />
+                        </div>
                         <div
-                          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
+                          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
                         >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              class="rjsf-field rjsf-field-string"
                             >
-                              <label
-                                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                                htmlFor="root_person_address_street"
-                              >
-                                street
-                              </label>
-                              <span
-                                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                              <div
+                                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                               >
-                                <input
-                                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                  autoFocus={false}
-                                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                                  disabled={false}
-                                  id="root_person_address_street"
-                                  name="root.person.address.street"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  placeholder=""
-                                  required={false}
-                                  type="text"
-                                  value=""
-                                />
-                              </span>
+                                <label
+                                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                                  for="root_person_address_street"
+                                >
+                                  street
+                                </label>
+                                <span
+                                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    id="root_person_address_street"
+                                    name="root.person.address.street"
+                                    placeholder=""
+                                    type="text"
+                                    value=""
+                                  />
+                                </span>
+                              </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              class="rjsf-field rjsf-field-string"
                             >
-                              <label
-                                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                                htmlFor="root_person_address_city"
-                              >
-                                city
-                              </label>
-                              <span
-                                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                              <div
+                                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                               >
-                                <input
-                                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                  autoFocus={false}
-                                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                                  disabled={false}
-                                  id="root_person_address_city"
-                                  name="root.person.address.city"
-                                  onBlur={[Function]}
-                                  onChange={[Function]}
-                                  onFocus={[Function]}
-                                  placeholder=""
-                                  required={false}
-                                  type="text"
-                                  value=""
-                                />
-                              </span>
+                                <label
+                                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                                  for="root_person_address_city"
+                                >
+                                  city
+                                </label>
+                                <span
+                                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    id="root_person_address_city"
+                                    name="root.person.address.city"
+                                    placeholder=""
+                                    type="text"
+                                    value=""
+                                  />
+                                </span>
+                              </div>
                             </div>
                           </div>
                         </div>
@@ -1408,418 +1165,389 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_name"
-              >
-                name
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_name"
-                  name="root.name"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value="Test"
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_name"
+                >
+                  name
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_name"
+                    name="root.name"
+                    placeholder=""
+                    type="text"
+                    value="Test"
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-number"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_count"
-              >
-                count
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_count__error root_count__description root_count__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_count"
-                  name="root.count"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value={5}
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_count"
+                >
+                  count
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_count__error root_count__description root_count__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_count"
+                    name="root.count"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value="5"
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-array"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-array"
             >
               <div
-                className="___12hmf4e_0000000 f2zxqi febqm8h"
-                id="root_items__title"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <h5
-                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-                  style={
-                    {
-                      "marginBlock": 0,
-                    }
-                  }
-                >
-                  items
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-                  role="separator"
-                />
-              </div>
-              <div
-                className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
-              >
+                  class="___12hmf4e_0000000 f2zxqi febqm8h"
+                  id="root_items__title"
+                >
+                  <h5
+                    class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                    style="margin-block: 0;"
+                  >
+                    items
+                  </h5>
+                  <div
+                    aria-orientation="horizontal"
+                    class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+                    role="separator"
+                  />
+                </div>
                 <div
-                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+                  class="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
                 >
                   <div
-                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                    class="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
                     >
                       <div
-                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                        class="rjsf-field rjsf-field-string"
                       >
-                        <label
-                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                          htmlFor="root_items_0"
+                        <div
+                          class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                         >
-                          items-0
+                          <label
+                            class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                            for="root_items_0"
+                          >
+                            items-0
+                            <span
+                              aria-hidden="true"
+                              class="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            >
+                              *
+                            </span>
+                          </label>
                           <span
-                            aria-hidden="true"
-                            className="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                           >
-                            *
+                            <input
+                              aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                              class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              id="root_items_0"
+                              name="root.items.0"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="a"
+                            />
                           </span>
-                        </label>
-                        <span
-                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                        >
-                          <input
-                            aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                            autoFocus={false}
-                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                            disabled={false}
-                            id="root_items_0"
-                            name="root.items.0"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="a"
-                          />
-                        </span>
+                        </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="fui-Flex ___1gzszts_10anl4a f22iagw"
-                    style={
-                      {
-                        "marginLeft": "8px",
-                      }
-                    }
-                  >
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-up ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
-                      disabled={true}
-                      id="root_items_0__moveUp"
-                      onClick={[Function]}
-                      title="Move up"
-                      type="button"
+                    <div
+                      class="fui-Flex ___1gzszts_10anl4a f22iagw"
+                      style="margin-left: 8px;"
                     >
-                      <span
-                        className="fui-Button__icon rywnvv2"
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-up ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
+                        disabled=""
+                        id="root_items_0__moveUp"
+                        title="Move up"
+                        type="button"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <path
-                            d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                             fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-down ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_items_0__moveDown"
-                      onClick={[Function]}
-                      title="Move down"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-down ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_items_0__moveDown"
+                        title="Move down"
+                        type="button"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <path
-                            d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                             fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_items_0__remove"
-                      onClick={[Function]}
-                      title="Remove"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_items_0__remove"
+                        title="Remove"
+                        type="button"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <path
-                            d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                             fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                    </div>
                   </div>
-                </div>
-                <div
-                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
-                >
                   <div
-                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                    class="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
                   >
                     <div
-                      className="rjsf-field rjsf-field-string"
+                      class="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
                     >
                       <div
-                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                        class="rjsf-field rjsf-field-string"
                       >
-                        <label
-                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                          htmlFor="root_items_1"
+                        <div
+                          class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                         >
-                          items-1
+                          <label
+                            class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                            for="root_items_1"
+                          >
+                            items-1
+                            <span
+                              aria-hidden="true"
+                              class="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            >
+                              *
+                            </span>
+                          </label>
                           <span
-                            aria-hidden="true"
-                            className="fui-Label__required ___di7pjm0_79xo450 f1whyuy6 fruq291"
+                            class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                           >
-                            *
+                            <input
+                              aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                              class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              id="root_items_1"
+                              name="root.items.1"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="b"
+                            />
                           </span>
-                        </label>
-                        <span
-                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-                        >
-                          <input
-                            aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                            autoFocus={false}
-                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                            disabled={false}
-                            id="root_items_1"
-                            name="root.items.1"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="b"
-                          />
-                        </span>
+                        </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="fui-Flex ___1gzszts_10anl4a f22iagw"
-                    style={
-                      {
-                        "marginLeft": "8px",
-                      }
-                    }
-                  >
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-up ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_items_1__moveUp"
-                      onClick={[Function]}
-                      title="Move up"
-                      type="button"
+                    <div
+                      class="fui-Flex ___1gzszts_10anl4a f22iagw"
+                      style="margin-left: 8px;"
                     >
-                      <span
-                        className="fui-Button__icon rywnvv2"
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-up ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_items_1__moveUp"
+                        title="Move up"
+                        type="button"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <path
-                            d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                             fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <button
-                      className="fui-Button r1alrhcs rjsf-array-item-move-down ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
-                      disabled={true}
-                      id="root_items_1__moveDown"
-                      onClick={[Function]}
-                      title="Move down"
-                      type="button"
-                    >
-                      <span
-                        className="fui-Button__icon rywnvv2"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M9 4.71 6.35 7.35a.5.5 0 1 1-.7-.7L9.1 3.18a.5.5 0 0 1 .74-.03h.01l3.5 3.5a.5.5 0 1 1-.71.7L10 4.71V16.5a.5.5 0 0 1-1 0V4.71Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-move-down ___7dg0yg0_z1vqji0 f1bg9a2p f1jj8ep1 f15xbau f4ikngz fy0fskl f1s2aq7o fdrzuqr f15x8b5r f1falr9n f12mpcsy f1gwvigk f1jnshp0 f18rmfxp fvgxktp fphbwmw f19vpps7 fv5swzo f1al02dq f1t6o4dc f10ztigi f1ft5sdu f12zbtn2 f1gzf82w fcvwxyo f8w4c43 f1ol4fw6 f1q1lw4e f1dwjv2g f4lkoma fg455y9 f1rvyvqg f1cwzwz f14g86mu f1dcs8yz fuigjrg fjwq6ea f1lr3nhc fn5gmvv f1mbxvi6 f1vmkb5g f53ppgq f1663y11 f18v5270 f80fkiy f1kc2mi9 f4dhi0o f1y0svfh fihuait fnxhupq fx507ft fyd6l6x fb3rf2x fequ9m0 f18ktai2 fwbmr0d f44c6la"
+                        disabled=""
+                        id="root_items_1__moveDown"
+                        title="Move down"
+                        type="button"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                          fill="currentColor"
-                          height="1em"
-                          viewBox="0 0 20 20"
-                          width="1em"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="fui-Button__icon rywnvv2"
                         >
-                          <path
-                            d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                             fill="currentColor"
-                          />
-                        </svg>
-                      </span>
-                    </button>
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="m10 15.29 2.65-2.64a.5.5 0 0 1 .7.7L9.9 16.82a.5.5 0 0 1-.74.03h-.01l-3.5-3.5a.5.5 0 1 1 .71-.7L9 15.29V3.5a.5.5 0 0 1 1 0v11.79Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <button
+                        class="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        id="root_items_1__remove"
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          class="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden="true"
+                            class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                            fill="currentColor"
+                            height="1em"
+                            viewBox="0 0 20 20"
+                            width="1em"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                              fill="currentColor"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
+                  >
                     <button
-                      className="fui-Button r1alrhcs rjsf-array-item-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                      disabled={false}
-                      id="root_items_1__remove"
-                      onClick={[Function]}
-                      title="Remove"
+                      class="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      id="root_items__add"
+                      title="Add Item"
                       type="button"
                     >
                       <span
-                        className="fui-Button__icon rywnvv2"
+                        class="fui-Button__icon rywnvv2"
                       >
                         <svg
-                          aria-hidden={true}
-                          className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                          aria-hidden="true"
+                          class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                           fill="currentColor"
                           height="1em"
                           viewBox="0 0 20 20"
@@ -1827,7 +1555,7 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                           xmlns="http://www.w3.org/2000/svg"
                         >
                           <path
-                            d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                            d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
                             fill="currentColor"
                           />
                         </svg>
@@ -1835,2651 +1563,2171 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                     </button>
                   </div>
                 </div>
-                <div
-                  className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-                >
-                  <button
-                    className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                    disabled={false}
-                    id="root_items__add"
-                    onClick={[Function]}
-                    title="Add Item"
-                    type="button"
-                  >
-                    <span
-                      className="fui-Button__icon rywnvv2"
-                    >
-                      <svg
-                        aria-hidden={true}
-                        className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                        fill="currentColor"
-                        height="1em"
-                        viewBox="0 0 20 20"
-                        width="1em"
-                        xmlns="http://www.w3.org/2000/svg"
-                      >
-                        <path
-                          d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                          fill="currentColor"
-                        />
-                      </svg>
-                    </span>
-                  </button>
-                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="rjsf-field rjsf-field-string"
-          >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-            >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_firstName"
-              >
-                firstName
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_firstName"
-                  name="root.firstName"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
-            </div>
-          </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_lastName"
-              >
-                lastName
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <input
-                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_lastName"
-                  name="root.lastName"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
+                <label
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_firstName"
+                >
+                  firstName
+                </label>
+                <span
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                >
+                  <input
+                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_firstName"
+                    name="root.firstName"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_age"
-              >
-                age
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_age"
-                  name="root.age"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </span>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
-`;
-
-exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
-  >
-    <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-    >
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
-          >
-            <div>
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r4__control"
-                  id="field-r4__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_lastName"
                 >
-                  foo Key
+                  lastName
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-r4__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_lastName"
+                    name="root.lastName"
+                    placeholder=""
                     type="text"
-                    value="foo"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_foo"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_age"
                 >
-                  foo
+                  age
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_age"
+                    name="root.age"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="foo"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
-                >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
-            </div>
           </div>
         </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
-          >
-            <span
-              className="fui-Button__icon rywnvv2"
-            >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                  fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_a"
-              >
-                A
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r4__control"
+                    id="field-r4__label"
+                  >
+                    foo Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r4__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_foo"
+                  >
+                    foo
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_b"
-              >
-                B
-              </label>
               <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                class="fui-Button__icon rywnvv2"
               >
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                  fill="currentColor"
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
               </span>
-            </div>
+            </button>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r7__control"
-                  id="field-r7__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_a"
                 >
-                  additionalProperty Key
+                  A
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-r7__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
-                    value="additionalProperty"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_additionalProperty"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_b"
                 >
-                  additionalProperty
+                  B
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
-                >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
-            </div>
           </div>
         </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
-          >
-            <span
-              className="fui-Button__icon rywnvv2"
-            >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                  fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
-      >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          Test field
-        </h5>
-        <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a test description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-rf__control"
-                  id="field-rf__label"
-                >
-                  foo Key
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+            <div
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            >
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-labelledby="field-rf__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r7__control"
+                    id="field-r7__label"
+                  >
+                    additionalProperty Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r7__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_foo"
-                >
-                  foo
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_additionalProperty"
+                  >
+                    additionalProperty
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
-                >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                       fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
+          <div
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <span
-              className="fui-Button__icon rywnvv2"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                class="fui-Button__icon rywnvv2"
               >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                   fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          My Field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a fancier description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            Test field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a test description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r17__control"
-                  id="field-r17__label"
-                >
-                  foo Key
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+            <div
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            >
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-labelledby="field-r17__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-rf__control"
+                    id="field-rf__label"
+                  >
+                    foo Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-rf__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_foo"
-                >
-                  foo
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_foo"
+                  >
+                    foo
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
-                >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                       fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
+          <div
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <span
-              className="fui-Button__icon rywnvv2"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                class="fui-Button__icon rywnvv2"
               >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                   fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from both additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          My Field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a fancier description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            My Field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a fancier description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_a"
-              >
-                My Item A
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
-              >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_a__description"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  a fancier item A description
-                </span>
-              </p>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r17__control"
+                    id="field-r17__label"
+                  >
+                    foo Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r17__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_foo"
+                  >
+                    foo
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_b"
-              >
-                My Item B
-              </label>
               <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
+                class="fui-Button__icon rywnvv2"
               >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_b__description"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                  fill="currentColor"
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  a fancier item B description
-                </span>
-              </p>
-            </div>
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from both object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          My Field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a fancier description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            My Field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a fancier description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-rr__control"
-                  id="field-rr__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_a"
                 >
-                  foo Key
+                  My Item A
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-rr__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
-                    value="foo"
+                    value=""
                   />
                 </span>
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
+                >
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_a__description"
+                  >
+                    a fancier item A description
+                  </span>
+                </p>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_foo"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_b"
                 >
-                  foo
+                  My Item B
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="foo"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
-              </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_b__description"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                    a fancier item B description
+                  </span>
+                </p>
+              </div>
             </div>
           </div>
         </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
-          >
-            <span
-              className="fui-Button__icon rywnvv2"
-            >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                  fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          My Field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a fancier description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            My Field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a fancier description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_a"
-              >
-                My Item A
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
-              >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_a__description"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  a fancier item A description
-                </span>
-              </p>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-rr__control"
+                    id="field-rr__label"
+                  >
+                    foo Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-rr__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_foo"
+                  >
+                    foo
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_b"
-              >
-                My Item B
-              </label>
               <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
+                class="fui-Button__icon rywnvv2"
               >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_b__description"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                  fill="currentColor"
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  a fancier item B description
-                </span>
-              </p>
-            </div>
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          My Field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a fancier description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            My Field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a fancier description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-rv__control"
-                  id="field-rv__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_a"
                 >
-                  additionalProperty Key
+                  My Item A
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-rv__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
-                    value="additionalProperty"
+                    value=""
                   />
                 </span>
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
+                >
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_a__description"
+                  >
+                    a fancier item A description
+                  </span>
+                </p>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_additionalProperty"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_b"
                 >
-                  additionalProperty
+                  My Item B
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
-              </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_b__description"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                    a fancier item B description
+                  </span>
+                </p>
+              </div>
             </div>
           </div>
         </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
-          >
-            <span
-              className="fui-Button__icon rywnvv2"
-            >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                  fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          Test field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a test description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            My Field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a fancier description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_a"
-              >
-                A
-              </label>
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
-              >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_a__description"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  A description
-                </span>
-              </p>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-rv__control"
+                    id="field-rv__label"
+                  >
+                    additionalProperty Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-rv__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_additionalProperty"
+                  >
+                    additionalProperty
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <label
-                className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                htmlFor="root_b"
-              >
-                B
-              </label>
               <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </span>
-              <p
-                className="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
-                style={
-                  {
-                    "marginBottom": 0,
-                    "marginTop": 0,
-                  }
-                }
+                class="fui-Button__icon rywnvv2"
               >
-                <span
-                  className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-                  id="root_b__description"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                  fill="currentColor"
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  B description
-                </span>
-              </p>
-            </div>
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="___12hmf4e_0000000 f2zxqi febqm8h"
-        id="root__title"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
-        <h5
-          className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
-          style={
-            {
-              "marginBlock": 0,
-            }
-          }
-        >
-          Test field
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
-          role="separator"
-        />
-      </div>
-      <span
-        className="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
-        id="root__description"
-      >
-        a test description
-      </span>
-      <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
-      >
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            Test field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a test description
+        </span>
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-rj__control"
-                  id="field-rj__label"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_a"
                 >
-                  additionalProperty Key
+                  A
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-rj__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
-                    value="additionalProperty"
+                    value=""
                   />
                 </span>
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
+                >
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_a__description"
+                  >
+                    A description
+                  </span>
+                </p>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <label
-                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
-                  htmlFor="root_additionalProperty"
+                  class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  for="root_b"
                 >
-                  additionalProperty
+                  B
                 </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
-              </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
+                <p
+                  class="fui-Text ___3772g50_1srj68j fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649"
+                  style="margin-top: 0px; margin-bottom: 0px;"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <span
+                    class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+                    id="root_b__description"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                    B description
+                  </span>
+                </p>
+              </div>
             </div>
           </div>
         </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
-          >
-            <span
-              className="fui-Button__icon rywnvv2"
-            >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
-                  fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="___12hmf4e_0000000 f2zxqi febqm8h"
+          id="root__title"
+        >
+          <h5
+            class="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+            style="margin-block: 0;"
+          >
+            Test field
+          </h5>
+          <div
+            aria-orientation="horizontal"
+            class="fui-Divider ___14drqcq_z8b5q40 f122n59 f1ewtqcl f22iagw f1063pyq fqerorx f10pi13n fk6fouc fy9rknc figsok6 fwrc4pm f17mccla fyl8oag f16vkdww fhsnbul f1gw3sf2 f1ly5f7u f1s3tz6t f1wl9k8s f13zj6fq fkfq4zb f1vccso1 f1geml7w f1r7kh1m fjml6kk f16j7guv fx01ahm fl8d8yv fj1a37q fly5x3f f163fonl f51yk4v f13rof3u f8rth92 f6czdpx f1iyka9k fzynn9s fekrn8e f1kyqvp9 fesgyo"
+            role="separator"
+          />
+        </div>
+        <span
+          class="fui-Text ___6s2bv30_bwsv0h0 fk6fouc fkhj508 f1i3iumi figsok6 fpgzoln ftgm304 f6juhto f1gl81tg f2jf649 frnwi6n f18zxyen"
+          id="root__description"
+        >
+          a test description
+        </span>
+        <div
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r1d__control"
-                  id="field-r1d__label"
-                >
-                  foo Key
-                </label>
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+            <div
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            >
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-labelledby="field-r1d__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-rj__control"
+                    id="field-rj__label"
+                  >
+                    additionalProperty Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-rj__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
-              >
-                <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
-                </span>
+                  <label
+                    class="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                    for="root_additionalProperty"
+                  >
+                    additionalProperty
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </span>
+                </div>
               </div>
-            </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
-                >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                       fill="currentColor"
-                    />
-                  </svg>
-                </span>
-              </button>
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
+          <div
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <span
-              className="fui-Button__icon rywnvv2"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                class="fui-Button__icon rywnvv2"
               >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                   fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description with global label off additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
             >
-              <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
-              >
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </span>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r1d__control"
+                    id="field-r1d__label"
+                  >
+                    foo Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r1d__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <div
-              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
               <span
-                className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                class="fui-Button__icon rywnvv2"
               >
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                  fill="currentColor"
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
               </span>
-            </div>
+            </button>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description with global label off object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
       >
         <div
-          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
         >
           <div
-            className="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
           >
-            <div>
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
-                <label
-                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
-                  htmlFor="field-r1g__control"
-                  id="field-r1g__label"
-                >
-                  additionalProperty Key
-                </label>
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-labelledby="field-r1g__label"
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
-                    value="additionalProperty"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
+          </div>
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
               <div
-                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
               >
                 <span
-                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
                 >
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </span>
               </div>
             </div>
-            <div>
-              <button
-                className="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                title="Remove"
-                type="button"
-              >
-                <span
-                  className="fui-Button__icon rywnvv2"
+          </div>
+        </div>
+      </div>
+    </div>
+    <div
+      class="___fko12g0_0000000 f1wswflg"
+    >
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
+`;
+
+exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+      >
+        <div
+          class="fui-Flex ___2axmsj0_qpg1ts0 f22iagw f1vx9l62 fly5x3f f1l02sjl f16r77es"
+        >
+          <div
+            class="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="fui-Flex rjsf-field rjsf-field-string ___8gv6eg0_pb6o3x0 f22iagw f122n59 f1lv1r8n"
+            >
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
                 >
-                  <svg
-                    aria-hidden={true}
-                    className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                    fill="currentColor"
-                    height="1em"
-                    viewBox="0 0 20 20"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <label
+                    class="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                    for="field-r1g__control"
+                    id="field-r1g__label"
                   >
-                    <path
-                      d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
-                      fill="currentColor"
+                    additionalProperty Key
+                  </label>
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-labelledby="field-r1g__label"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
                     />
-                  </svg>
-                </span>
-              </button>
+                  </span>
+                </div>
+              </div>
+              <div>
+                <div
+                  class="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                >
+                  <span
+                    class="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                  >
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </span>
+                </div>
+              </div>
+              <div>
+                <button
+                  class="fui-Button r1alrhcs rjsf-object-property-remove ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="fui-Button__icon rywnvv2"
+                  >
+                    <svg
+                      aria-hidden="true"
+                      class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M3 10c0-.28.22-.5.5-.5h13a.5.5 0 0 1 0 1h-13A.5.5 0 0 1 3 10Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
-        >
-          <button
-            className="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            title="Add Item"
-            type="button"
+          <div
+            class="fui-Flex ___1ncave0_cx496c0 f22iagw f9c4gz4"
           >
-            <span
-              className="fui-Button__icon rywnvv2"
+            <button
+              class="fui-Button r1alrhcs rjsf-object-property-expand ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              id="root__add"
+              title="Add Item"
+              type="button"
             >
-              <svg
-                aria-hidden={true}
-                className="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
-                fill="currentColor"
-                height="1em"
-                viewBox="0 0 20 20"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <span
+                class="fui-Button__icon rywnvv2"
               >
-                <path
-                  d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                <svg
+                  aria-hidden="true"
+                  class="___9ctc0p0_1xvj9ao f1w7gpdv fez10in f1dd5bof"
                   fill="currentColor"
-                />
-              </svg>
-            </span>
-          </button>
+                  height="1em"
+                  viewBox="0 0 20 20"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    d="M10 2.5c.28 0 .5.22.5.5v6.5H17a.5.5 0 0 1 0 1h-6.5V17a.5.5 0 0 1-1 0v-6.5H3a.5.5 0 0 1 0-1h6.5V3c0-.28.22-.5.5-.5Z"
+                    fill="currentColor"
+                  />
+                </svg>
+              </span>
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="___fko12g0_0000000 f1wswflg"
-  >
-    <button
-      className="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
-      disabled={false}
-      onClick={[Function]}
-      type="submit"
+    <div
+      class="___fko12g0_0000000 f1wswflg"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="fui-Button r1alrhcs ___1akj6hk_ih97uj0 ffp7eso f1p3nwhy f11589ue f1q5o8ev f1pdflbu f1phragk f15wkkf3 f1s2uweq fr80ssc f1ukrpxl fecsdlb f1rq72xc fnp9lpt f1h0usnq fs4ktlq f16h9ulv fx2bmrt f1d6v5y2 f1rirnrt f1uu00uk fkvaka8 f1ux7til f9a0qzu f1lkg8j3 fkc42ay fq7113v ff1wgvm fiob0tu f1j6scgf f1x4h75k f4xjyn1 fbgcvur f1ks1yx8 f1o6qegi fcnxywj fmxjhhp f9ddjv3 f17t0x8g f194v5ow f1qgg65p fk7jm04 fhgccpy f32wu9k fu5nqqq f13prjl2 f1czftr5 f1nl83rv f12k37oa fr96u23"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/mantine/test/__snapshots__/Object.test.tsx.snap b/packages/mantine/test/__snapshots__/Object.test.tsx.snap
index fceec1206f..aa2bb00d9d 100644
--- a/packages/mantine/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/mantine/test/__snapshots__/Object.test.tsx.snap
@@ -1,14201 +1,5861 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rce{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "person",
-                                ],
-                                "props": {
-                                  "className": "m_8a5d1357",
-                                  "data-order": 3,
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "id": "root_person__title",
-                                  "size": undefined,
-                                  "style": {
-                                    "--title-fw": "var(--mantine-h3-font-weight)",
-                                    "--title-fz": "var(--mantine-h3-font-size)",
-                                    "--title-lh": "var(--mantine-h3-line-height)",
-                                    "fontWeight": "normal",
-                                  },
-                                },
-                                "type": "h3",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-rcj{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "name",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_person_name",
-                                                  "id": "root_person_name-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_person_name",
-                                                      "name": "root[person][name]",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "rjsf-field rjsf-field-string",
-                                          "style": undefined,
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "address",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8a5d1357",
-                                                  "data-order": 3,
-                                                  "data-size": undefined,
-                                                  "data-variant": undefined,
-                                                  "id": "root_person_address__title",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--title-fw": "var(--mantine-h3-font-weight)",
-                                                    "--title-fz": "var(--mantine-h3-font-size)",
-                                                    "--title-lh": "var(--mantine-h3-line-height)",
-                                                    "fontWeight": "normal",
-                                                  },
-                                                },
-                                                "type": "h3",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "dangerouslySetInnerHTML": {
-                                                    "__html": ".__m__-rcu{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                                                  },
-                                                  "data-mantine-styles": "inline",
-                                                  "nonce": undefined,
-                                                },
-                                                "type": "style",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": [
-                                                              {
-                                                                "children": [
-                                                                  "street",
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_8fdc1311",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": undefined,
-                                                                  "htmlFor": "root_person_address_street",
-                                                                  "id": "root_person_address_street-label",
-                                                                  "onMouseDown": [Function],
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "label",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                              {
-                                                                "children": [
-                                                                  {
-                                                                    "children": null,
-                                                                    "props": {
-                                                                      "aria-describedby": undefined,
-                                                                      "aria-invalid": false,
-                                                                      "autoFocus": false,
-                                                                      "className": "m_8fb7ebe7",
-                                                                      "data-size": undefined,
-                                                                      "data-variant": "default",
-                                                                      "disabled": false,
-                                                                      "id": "root_person_address_street",
-                                                                      "name": "root[person][address][street]",
-                                                                      "onBlur": [Function],
-                                                                      "onChange": [Function],
-                                                                      "onFocus": [Function],
-                                                                      "placeholder": "",
-                                                                      "required": false,
-                                                                      "size": undefined,
-                                                                      "style": {},
-                                                                      "type": "text",
-                                                                    },
-                                                                    "type": "input",
-                                                                    Symbol(cleaned): true,
-                                                                  },
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_6c018570",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": "default",
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                                    "--input-height": "var(--input-height-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "div",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                            ],
-                                                            "props": {
-                                                              "className": "m_46b77525",
-                                                              "data-size": "sm",
-                                                              "data-variant": undefined,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                            },
-                                                            "type": "div",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "rjsf-field rjsf-field-string",
-                                                          "style": undefined,
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": [
-                                                              {
-                                                                "children": [
-                                                                  "city",
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_8fdc1311",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": undefined,
-                                                                  "htmlFor": "root_person_address_city",
-                                                                  "id": "root_person_address_city-label",
-                                                                  "onMouseDown": [Function],
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "label",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                              {
-                                                                "children": [
-                                                                  {
-                                                                    "children": null,
-                                                                    "props": {
-                                                                      "aria-describedby": undefined,
-                                                                      "aria-invalid": false,
-                                                                      "autoFocus": false,
-                                                                      "className": "m_8fb7ebe7",
-                                                                      "data-size": undefined,
-                                                                      "data-variant": "default",
-                                                                      "disabled": false,
-                                                                      "id": "root_person_address_city",
-                                                                      "name": "root[person][address][city]",
-                                                                      "onBlur": [Function],
-                                                                      "onChange": [Function],
-                                                                      "onFocus": [Function],
-                                                                      "placeholder": "",
-                                                                      "required": false,
-                                                                      "size": undefined,
-                                                                      "style": {},
-                                                                      "type": "text",
-                                                                    },
-                                                                    "type": "input",
-                                                                    Symbol(cleaned): true,
-                                                                  },
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_6c018570",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": "default",
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                                    "--input-height": "var(--input-height-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "div",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                            ],
-                                                            "props": {
-                                                              "className": "m_46b77525",
-                                                              "data-size": "sm",
-                                                              "data-variant": undefined,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                            },
-                                                            "type": "div",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "rjsf-field rjsf-field-string",
-                                                          "style": undefined,
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": [
-                                                              {
-                                                                "children": [
-                                                                  "country",
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_8fdc1311",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": undefined,
-                                                                  "htmlFor": "root_person_address_country",
-                                                                  "id": "root_person_address_country-label",
-                                                                  "onMouseDown": [Function],
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "label",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                              {
-                                                                "children": [
-                                                                  {
-                                                                    "children": null,
-                                                                    "props": {
-                                                                      "aria-describedby": undefined,
-                                                                      "aria-invalid": false,
-                                                                      "autoFocus": false,
-                                                                      "className": "m_8fb7ebe7",
-                                                                      "data-size": undefined,
-                                                                      "data-variant": "default",
-                                                                      "disabled": false,
-                                                                      "id": "root_person_address_country",
-                                                                      "name": "root[person][address][country]",
-                                                                      "onBlur": [Function],
-                                                                      "onChange": [Function],
-                                                                      "onFocus": [Function],
-                                                                      "placeholder": "",
-                                                                      "required": false,
-                                                                      "size": undefined,
-                                                                      "style": {},
-                                                                      "type": "text",
-                                                                    },
-                                                                    "type": "input",
-                                                                    Symbol(cleaned): true,
-                                                                  },
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_6c018570",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": "default",
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                                    "--input-height": "var(--input-height-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "div",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                            ],
-                                                            "props": {
-                                                              "className": "m_46b77525",
-                                                              "data-size": "sm",
-                                                              "data-variant": undefined,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                            },
-                                                            "type": "div",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "rjsf-field rjsf-field-string",
-                                                          "style": undefined,
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_2415a157 __m__-rcu",
-                                                  "data-size": undefined,
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "marginBottom": "var(--mantine-spacing-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_7485cace",
-                                              "data-size": undefined,
-                                              "data-strategy": "block",
-                                              "data-variant": undefined,
-                                              "id": "root_person_address",
-                                              "size": undefined,
-                                              "style": {
-                                                "padding": "0rem",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "rjsf-field rjsf-field-object",
-                                          "style": undefined,
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_2415a157 __m__-rcj",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "marginBottom": "var(--mantine-spacing-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_7485cace",
-                              "data-size": undefined,
-                              "data-strategy": "block",
-                              "data-variant": undefined,
-                              "id": "root_person",
-                              "size": undefined,
-                              "style": {
-                                "padding": "0rem",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-object",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rce",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rce{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rce"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-object"
+            >
+              <div
+                class="m_7485cace mantine-Container-root"
+                data-strategy="block"
+                id="root_person"
+                style="padding: 0rem;"
+              >
+                <h3
+                  class="m_8a5d1357 mantine-Title-root"
+                  data-order="3"
+                  id="root_person__title"
+                  style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+                >
+                  person
+                </h3>
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-rcj{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+                </style>
+                <div
+                  class="m_2415a157 mantine-SimpleGrid-root __m__-rcj"
+                  style="margin-bottom: var(--mantine-spacing-sm);"
+                >
+                  <div
+                    class=""
+                  >
+                    <div
+                      class="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_person_name"
+                          id="root_person_name-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          name
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_person_name"
+                            name="root[person][name]"
+                            placeholder=""
+                            type="text"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class=""
+                  >
+                    <div
+                      class="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        class="m_7485cace mantine-Container-root"
+                        data-strategy="block"
+                        id="root_person_address"
+                        style="padding: 0rem;"
+                      >
+                        <h3
+                          class="m_8a5d1357 mantine-Title-root"
+                          data-order="3"
+                          id="root_person_address__title"
+                          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+                        >
+                          address
+                        </h3>
+                        <style
+                          data-mantine-styles="inline"
+                        >
+                          .__m__-rcu{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+                        </style>
+                        <div
+                          class="m_2415a157 mantine-SimpleGrid-root __m__-rcu"
+                          style="margin-bottom: var(--mantine-spacing-sm);"
+                        >
+                          <div
+                            class=""
+                          >
+                            <div
+                              class="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                                data-size="sm"
+                              >
+                                <label
+                                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                                  data-size="sm"
+                                  for="root_person_address_street"
+                                  id="root_person_address_street-label"
+                                  style="--input-label-size: var(--mantine-font-size-sm);"
+                                >
+                                  street
+                                </label>
+                                <div
+                                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                                  data-size="sm"
+                                  data-variant="default"
+                                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                                >
+                                  <input
+                                    aria-invalid="false"
+                                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                    data-variant="default"
+                                    id="root_person_address_street"
+                                    name="root[person][address][street]"
+                                    placeholder=""
+                                    type="text"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            class=""
+                          >
+                            <div
+                              class="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                                data-size="sm"
+                              >
+                                <label
+                                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                                  data-size="sm"
+                                  for="root_person_address_city"
+                                  id="root_person_address_city-label"
+                                  style="--input-label-size: var(--mantine-font-size-sm);"
+                                >
+                                  city
+                                </label>
+                                <div
+                                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                                  data-size="sm"
+                                  data-variant="default"
+                                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                                >
+                                  <input
+                                    aria-invalid="false"
+                                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                    data-variant="default"
+                                    id="root_person_address_city"
+                                    name="root[person][address][city]"
+                                    placeholder=""
+                                    type="text"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            class=""
+                          >
+                            <div
+                              class="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                                data-size="sm"
+                              >
+                                <label
+                                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                                  data-size="sm"
+                                  for="root_person_address_country"
+                                  id="root_person_address_country-label"
+                                  style="--input-label-size: var(--mantine-font-size-sm);"
+                                >
+                                  country
+                                </label>
+                                <div
+                                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                                  data-size="sm"
+                                  data-variant="default"
+                                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                                >
+                                  <input
+                                    aria-invalid="false"
+                                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                    data-variant="default"
+                                    id="root_person_address_country"
+                                    name="root[person][address][country]"
+                                    placeholder=""
+                                    type="text"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rdl{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "name",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_name",
-                                  "id": "root_name-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_name",
-                                      "name": "root[name]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "John",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-re0{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-re2{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "customField Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_customField-key",
-                                                      "id": "root_customField-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "customField",
-                                                          "disabled": false,
-                                                          "id": "root_customField-key",
-                                                          "name": "root_customField-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-re2",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-re9{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "customField",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_customField",
-                                                  "id": "root_customField-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_customField",
-                                                      "name": "root[customField]",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "customValue",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-re9",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-re0",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_customField__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-rdu",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rdl",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rdl{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rdl"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_name"
+                  id="root_name-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  name
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_name"
+                    name="root[name]"
+                    placeholder=""
+                    type="text"
+                    value="John"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-rdu"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-re0{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-re0"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-re2{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-re2"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_customField-key"
+                            id="root_customField-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            customField Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_customField-key"
+                              name="root_customField-key"
+                              value="customField"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-re9{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-re9"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_customField"
+                          id="root_customField-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          customField
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_customField"
+                            name="root[customField]"
+                            placeholder=""
+                            type="text"
+                            value="customValue"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_customField__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-reo{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "name",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_name",
-                                  "id": "root_name-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_name",
-                                      "name": "root[name]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "Alice",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "age",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_age",
-                                  "id": "root_age-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_age",
-                                      "inputMode": "numeric",
-                                      "name": "root[age]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "30",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "aria-describedby": "root_active__error root_active__description root_active__help",
-                                          "autoFocus": false,
-                                          "checked": true,
-                                          "className": "m_26063560",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "disabled": false,
-                                          "id": "root_active",
-                                          "name": "root[active]",
-                                          "onBlur": [Function],
-                                          "onChange": [Function],
-                                          "onFocus": [Function],
-                                          "required": false,
-                                          "size": undefined,
-                                          "style": {},
-                                          "type": "checkbox",
-                                        },
-                                        "type": "input",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "clipRule": "evenodd",
-                                              "d": "M4 4.586L1.707 2.293A1 1 0 1 0 .293 3.707l3 3a.997.997 0 0 0 1.414 0l5-5A1 1 0 1 0 8.293.293L4 4.586z",
-                                              "fill": "currentColor",
-                                              "fillRule": "evenodd",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "aria-hidden": true,
-                                          "className": "m_bf295423",
-                                          "fill": "none",
-                                          "style": {},
-                                          "viewBox": "0 0 10 7",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_26062bec",
-                                      "data-label-position": "right",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          "active",
-                                        ],
-                                        "props": {
-                                          "className": "m_8ee546b8",
-                                          "data-disabled": undefined,
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "htmlFor": "root_active",
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "label",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_d3ea56bb",
-                                      "data-disabled": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_5f6e695e",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "htmlFor": undefined,
-                                  "size": undefined,
-                                  "style": {},
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_bf2d988c m_5f75b09e",
-                              "data-checked": true,
-                              "data-label-position": "right",
-                              "data-size": undefined,
-                              "data-variant": "filled",
-                              "size": undefined,
-                              "style": {
-                                "--checkbox-color": "var(--mantine-color-blue-filled)",
-                                "--label-fz": undefined,
-                                "--label-lh": undefined,
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-boolean",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      "tags",
-                                    ],
-                                    "props": {
-                                      "className": "m_8a5d1357",
-                                      "data-order": 4,
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "id": "root_tags__title",
-                                      "size": undefined,
-                                      "style": {
-                                        "--title-fw": "var(--mantine-h4-font-weight)",
-                                        "--title-fz": "var(--mantine-h4-font-size)",
-                                        "--title-lh": "var(--mantine-h4-line-height)",
-                                        "fontWeight": "normal",
-                                      },
-                                    },
-                                    "type": "h4",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_90794832",
-                                  "style": {},
-                                },
-                                "type": "legend",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          "tags-0",
-                                                          {
-                                                            "children": [
-                                                              " *",
-                                                            ],
-                                                            "props": {
-                                                              "aria-hidden": true,
-                                                              "className": "m_78a94662",
-                                                              "style": {},
-                                                            },
-                                                            "type": "span",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_8fdc1311",
-                                                          "data-required": true,
-                                                          "data-size": "sm",
-                                                          "data-variant": undefined,
-                                                          "htmlFor": "root_tags_0",
-                                                          "id": "root_tags_0-label",
-                                                          "onMouseDown": [Function],
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-label-size": "var(--mantine-font-size-sm)",
-                                                          },
-                                                        },
-                                                        "type": "label",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "aria-describedby": undefined,
-                                                              "aria-invalid": false,
-                                                              "autoFocus": false,
-                                                              "className": "m_8fb7ebe7",
-                                                              "data-size": undefined,
-                                                              "data-variant": "default",
-                                                              "disabled": false,
-                                                              "id": "root_tags_0",
-                                                              "name": "root[tags][0]",
-                                                              "onBlur": [Function],
-                                                              "onChange": [Function],
-                                                              "onFocus": [Function],
-                                                              "placeholder": "",
-                                                              "required": true,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                              "type": "text",
-                                                              "value": "developer",
-                                                            },
-                                                            "type": "input",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_6c018570",
-                                                          "data-size": "sm",
-                                                          "data-variant": "default",
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-fz": "var(--mantine-font-size-sm)",
-                                                            "--input-height": "var(--input-height-sm)",
-                                                          },
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_46b77525",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-field rjsf-field-string",
-                                                  "style": undefined,
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "width": "100%",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 15l6 -6l6 6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-up",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-up m_8d3f4000 m_87cf2631",
-                                                  "data-disabled": true,
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "disabled": true,
-                                                  "id": "root_tags_0__moveUp",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move up",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 9l6 6l6 -6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-down m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_tags_0__moveDown",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move down",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M18 6l-12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 6l12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_tags_0__remove",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Remove",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_4081bf90",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "--group-align": "center",
-                                                "--group-gap": "calc(0.125rem * var(--mantine-scale))",
-                                                "--group-justify": "flex-start",
-                                                "--group-wrap": "nowrap",
-                                                "marginBottom": "calc(0.4375rem * var(--mantine-scale))",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8bffd616 __m__-rfk",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {
-                                            "alignItems": "end",
-                                            "gap": "var(--mantine-spacing-xs)",
-                                            "justifyContent": "center",
-                                          },
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {
-                                        "marginBottom": "var(--mantine-spacing-xs)",
-                                      },
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          "tags-1",
-                                                          {
-                                                            "children": [
-                                                              " *",
-                                                            ],
-                                                            "props": {
-                                                              "aria-hidden": true,
-                                                              "className": "m_78a94662",
-                                                              "style": {},
-                                                            },
-                                                            "type": "span",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_8fdc1311",
-                                                          "data-required": true,
-                                                          "data-size": "sm",
-                                                          "data-variant": undefined,
-                                                          "htmlFor": "root_tags_1",
-                                                          "id": "root_tags_1-label",
-                                                          "onMouseDown": [Function],
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-label-size": "var(--mantine-font-size-sm)",
-                                                          },
-                                                        },
-                                                        "type": "label",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "aria-describedby": undefined,
-                                                              "aria-invalid": false,
-                                                              "autoFocus": false,
-                                                              "className": "m_8fb7ebe7",
-                                                              "data-size": undefined,
-                                                              "data-variant": "default",
-                                                              "disabled": false,
-                                                              "id": "root_tags_1",
-                                                              "name": "root[tags][1]",
-                                                              "onBlur": [Function],
-                                                              "onChange": [Function],
-                                                              "onFocus": [Function],
-                                                              "placeholder": "",
-                                                              "required": true,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                              "type": "text",
-                                                              "value": "designer",
-                                                            },
-                                                            "type": "input",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_6c018570",
-                                                          "data-size": "sm",
-                                                          "data-variant": "default",
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-fz": "var(--mantine-font-size-sm)",
-                                                            "--input-height": "var(--input-height-sm)",
-                                                          },
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_46b77525",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-field rjsf-field-string",
-                                                  "style": undefined,
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "width": "100%",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 15l6 -6l6 6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-up",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-up m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_tags_1__moveUp",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move up",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 9l6 6l6 -6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-down m_8d3f4000 m_87cf2631",
-                                                  "data-disabled": true,
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "disabled": true,
-                                                  "id": "root_tags_1__moveDown",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move down",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M18 6l-12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 6l12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_tags_1__remove",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Remove",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_4081bf90",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "--group-align": "center",
-                                                "--group-gap": "calc(0.125rem * var(--mantine-scale))",
-                                                "--group-justify": "flex-start",
-                                                "--group-wrap": "nowrap",
-                                                "marginBottom": "calc(0.4375rem * var(--mantine-scale))",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8bffd616 __m__-rg4",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {
-                                            "alignItems": "end",
-                                            "gap": "var(--mantine-spacing-xs)",
-                                            "justifyContent": "center",
-                                          },
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {
-                                        "marginBottom": "var(--mantine-spacing-xs)",
-                                      },
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "row rjsf-array-item-list",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {},
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M0 0h24v24H0z",
-                                                  "fill": "none",
-                                                  "stroke": "none",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M12 5l0 14",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M5 12l14 0",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                                              "fill": "none",
-                                              "height": "24",
-                                              "stroke": "currentColor",
-                                              "strokeLinecap": "round",
-                                              "strokeLinejoin": "round",
-                                              "strokeWidth": "2",
-                                              "style": {
-                                                "height": undefined,
-                                                "width": undefined,
-                                              },
-                                              "viewBox": "0 0 24 24",
-                                              "width": "24",
-                                              "xmlns": "http://www.w3.org/2000/svg",
-                                            },
-                                            "type": "svg",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8d3afb97",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "span",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item-add m_8d3f4000 m_87cf2631",
-                                      "data-size": "md",
-                                      "data-variant": "subtle",
-                                      "id": "root_tags__add",
-                                      "onClick": [Function],
-                                      "size": undefined,
-                                      "style": {
-                                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                        "--ai-bg": "transparent",
-                                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                        "--ai-size": "var(--ai-size-md)",
-                                      },
-                                      "title": "Add Item",
-                                      "type": "button",
-                                    },
-                                    "type": "button",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_4081bf90",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--group-align": "center",
-                                    "--group-gap": "var(--mantine-spacing-md)",
-                                    "--group-justify": "flex-end",
-                                    "--group-wrap": "wrap",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_84c9523a rjsf-field rjsf-field-array rjsf-field-array-of-string m_e9408a47",
-                              "data-size": undefined,
-                              "data-variant": "default",
-                              "id": "root_tags",
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "fieldset",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-array",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-reo",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-reo{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-reo"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_name"
+                  id="root_name-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  name
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_name"
+                    name="root[name]"
+                    placeholder=""
+                    type="text"
+                    value="Alice"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_age"
+                  id="root_age-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  age
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_age"
+                    inputmode="numeric"
+                    name="root[age]"
+                    placeholder=""
+                    type="text"
+                    value="30"
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                class="m_bf2d988c mantine-Checkbox-root m_5f75b09e mantine-Checkbox-root"
+                data-checked="true"
+                data-label-position="right"
+                data-variant="filled"
+                style="--checkbox-color: var(--mantine-color-blue-filled);"
+              >
+                <div
+                  class="m_5f6e695e mantine-Checkbox-body"
+                >
+                  <div
+                    class="m_26062bec mantine-Checkbox-inner"
+                    data-label-position="right"
+                  >
+                    <input
+                      aria-describedby="root_active__error root_active__description root_active__help"
+                      checked=""
+                      class="mantine-focus-auto m_26063560 mantine-Checkbox-input"
+                      id="root_active"
+                      name="root[active]"
+                      type="checkbox"
+                    />
+                    <svg
+                      aria-hidden="true"
+                      class="m_bf295423 mantine-Checkbox-icon"
+                      fill="none"
+                      viewBox="0 0 10 7"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        clip-rule="evenodd"
+                        d="M4 4.586L1.707 2.293A1 1 0 1 0 .293 3.707l3 3a.997.997 0 0 0 1.414 0l5-5A1 1 0 1 0 8.293.293L4 4.586z"
+                        fill="currentColor"
+                        fill-rule="evenodd"
+                      />
+                    </svg>
+                  </div>
+                  <div
+                    class="m_d3ea56bb mantine-Checkbox-labelWrapper"
+                  >
+                    <label
+                      class="m_8ee546b8 mantine-Checkbox-label"
+                      for="root_active"
+                    >
+                      active
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                class="m_84c9523a rjsf-field rjsf-field-array rjsf-field-array-of-string m_e9408a47 mantine-Fieldset-root"
+                data-variant="default"
+                id="root_tags"
+              >
+                <legend
+                  class="m_90794832 mantine-Fieldset-legend"
+                >
+                  <h4
+                    class="m_8a5d1357 mantine-Title-root"
+                    data-order="4"
+                    id="root_tags__title"
+                    style="--title-fw: var(--mantine-h4-font-weight); --title-lh: var(--mantine-h4-line-height); --title-fz: var(--mantine-h4-font-size); font-weight: normal;"
+                  >
+                    tags
+                  </h4>
+                </legend>
+                <div
+                  class="row rjsf-array-item-list"
+                >
+                  <div
+                    class="rjsf-array-item"
+                    style="margin-bottom: var(--mantine-spacing-xs);"
+                  >
+                    <div
+                      class="m_8bffd616 mantine-Flex-root __m__-rfk"
+                      style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+                    >
+                      <div
+                        class=""
+                        style="width: 100%;"
+                      >
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                            data-size="sm"
+                          >
+                            <label
+                              class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                              data-required="true"
+                              data-size="sm"
+                              for="root_tags_0"
+                              id="root_tags_0-label"
+                              style="--input-label-size: var(--mantine-font-size-sm);"
+                            >
+                              tags-0
+                              <span
+                                aria-hidden="true"
+                                class="m_78a94662 mantine-InputWrapper-required mantine-TextInput-required"
+                              >
+                                 *
+                              </span>
+                            </label>
+                            <div
+                              class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                              data-size="sm"
+                              data-variant="default"
+                              style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                            >
+                              <input
+                                aria-invalid="false"
+                                class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                data-variant="default"
+                                id="root_tags_0"
+                                name="root[tags][0]"
+                                placeholder=""
+                                required=""
+                                type="text"
+                                value="developer"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        class="m_4081bf90 mantine-Group-root"
+                        style="--group-gap: calc(0.125rem * var(--mantine-scale)); --group-align: center; --group-justify: flex-start; --group-wrap: nowrap; margin-bottom: calc(0.4375rem * var(--mantine-scale));"
+                      >
+                        <button
+                          class="mantine-focus-auto rjsf-array-item-move-up m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-disabled="true"
+                          data-size="sm"
+                          data-variant="subtle"
+                          disabled=""
+                          id="root_tags_0__moveUp"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move up"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-up"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 15l6 -6l6 6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-move-down m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_tags_0__moveDown"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move down"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-down"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 9l6 6l6 -6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_tags_0__remove"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Remove"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M18 6l-12 12"
+                              />
+                              <path
+                                d="M6 6l12 12"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class="rjsf-array-item"
+                    style="margin-bottom: var(--mantine-spacing-xs);"
+                  >
+                    <div
+                      class="m_8bffd616 mantine-Flex-root __m__-rg4"
+                      style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+                    >
+                      <div
+                        class=""
+                        style="width: 100%;"
+                      >
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                            data-size="sm"
+                          >
+                            <label
+                              class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                              data-required="true"
+                              data-size="sm"
+                              for="root_tags_1"
+                              id="root_tags_1-label"
+                              style="--input-label-size: var(--mantine-font-size-sm);"
+                            >
+                              tags-1
+                              <span
+                                aria-hidden="true"
+                                class="m_78a94662 mantine-InputWrapper-required mantine-TextInput-required"
+                              >
+                                 *
+                              </span>
+                            </label>
+                            <div
+                              class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                              data-size="sm"
+                              data-variant="default"
+                              style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                            >
+                              <input
+                                aria-invalid="false"
+                                class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                data-variant="default"
+                                id="root_tags_1"
+                                name="root[tags][1]"
+                                placeholder=""
+                                required=""
+                                type="text"
+                                value="designer"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        class="m_4081bf90 mantine-Group-root"
+                        style="--group-gap: calc(0.125rem * var(--mantine-scale)); --group-align: center; --group-justify: flex-start; --group-wrap: nowrap; margin-bottom: calc(0.4375rem * var(--mantine-scale));"
+                      >
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-move-up m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_tags_1__moveUp"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move up"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-up"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 15l6 -6l6 6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto rjsf-array-item-move-down m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-disabled="true"
+                          data-size="sm"
+                          data-variant="subtle"
+                          disabled=""
+                          id="root_tags_1__moveDown"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move down"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-down"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 9l6 6l6 -6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_tags_1__remove"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Remove"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M18 6l-12 12"
+                              />
+                              <path
+                                d="M6 6l12 12"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="m_4081bf90 mantine-Group-root"
+                  style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap;"
+                >
+                  <button
+                    class="mantine-focus-auto mantine-active rjsf-array-item-add m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                    data-size="md"
+                    data-variant="subtle"
+                    id="root_tags__add"
+                    style="--ai-size: var(--ai-size-md); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                    title="Add Item"
+                    type="button"
+                  >
+                    <span
+                      class="m_8d3afb97 mantine-ActionIcon-icon"
+                    >
+                      <svg
+                        class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                        fill="none"
+                        height="24"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        viewBox="0 0 24 24"
+                        width="24"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="M0 0h24v24H0z"
+                          fill="none"
+                          stroke="none"
+                        />
+                        <path
+                          d="M12 5l0 14"
+                        />
+                        <path
+                          d="M5 12l14 0"
+                        />
+                      </svg>
+                    </span>
+                  </button>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rbl{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "firstName",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_firstName",
-                                  "id": "root_firstName-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_firstName",
-                                      "name": "root[firstName]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "lastName",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_lastName",
-                                  "id": "root_lastName-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_lastName",
-                                      "name": "root[lastName]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "age",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_age",
-                                  "id": "root_age-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_age",
-                                      "inputMode": "numeric",
-                                      "name": "root[age]",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rbl",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rbl{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rbl"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_firstName"
+                  id="root_firstName-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  firstName
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_firstName"
+                    name="root[firstName]"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_lastName"
+                  id="root_lastName-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  lastName
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_lastName"
+                    name="root[lastName]"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_age"
+                  id="root_age-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  age
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_age"
+                    inputmode="numeric"
+                    name="root[age]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rhi{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "person",
-                                ],
-                                "props": {
-                                  "className": "m_8a5d1357",
-                                  "data-order": 3,
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "id": "root_person__title",
-                                  "size": undefined,
-                                  "style": {
-                                    "--title-fw": "var(--mantine-h3-font-weight)",
-                                    "--title-fz": "var(--mantine-h3-font-size)",
-                                    "--title-lh": "var(--mantine-h3-line-height)",
-                                    "fontWeight": "normal",
-                                  },
-                                },
-                                "type": "h3",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-rhn{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "name",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_person_name",
-                                                  "id": "root_person_name-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_person_name",
-                                                      "name": "root.person.name",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "rjsf-field rjsf-field-string",
-                                          "style": undefined,
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "address",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8a5d1357",
-                                                  "data-order": 3,
-                                                  "data-size": undefined,
-                                                  "data-variant": undefined,
-                                                  "id": "root_person_address__title",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--title-fw": "var(--mantine-h3-font-weight)",
-                                                    "--title-fz": "var(--mantine-h3-font-size)",
-                                                    "--title-lh": "var(--mantine-h3-line-height)",
-                                                    "fontWeight": "normal",
-                                                  },
-                                                },
-                                                "type": "h3",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "dangerouslySetInnerHTML": {
-                                                    "__html": ".__m__-ri2{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                                                  },
-                                                  "data-mantine-styles": "inline",
-                                                  "nonce": undefined,
-                                                },
-                                                "type": "style",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": [
-                                                              {
-                                                                "children": [
-                                                                  "street",
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_8fdc1311",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": undefined,
-                                                                  "htmlFor": "root_person_address_street",
-                                                                  "id": "root_person_address_street-label",
-                                                                  "onMouseDown": [Function],
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "label",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                              {
-                                                                "children": [
-                                                                  {
-                                                                    "children": null,
-                                                                    "props": {
-                                                                      "aria-describedby": undefined,
-                                                                      "aria-invalid": false,
-                                                                      "autoFocus": false,
-                                                                      "className": "m_8fb7ebe7",
-                                                                      "data-size": undefined,
-                                                                      "data-variant": "default",
-                                                                      "disabled": false,
-                                                                      "id": "root_person_address_street",
-                                                                      "name": "root.person.address.street",
-                                                                      "onBlur": [Function],
-                                                                      "onChange": [Function],
-                                                                      "onFocus": [Function],
-                                                                      "placeholder": "",
-                                                                      "required": false,
-                                                                      "size": undefined,
-                                                                      "style": {},
-                                                                      "type": "text",
-                                                                    },
-                                                                    "type": "input",
-                                                                    Symbol(cleaned): true,
-                                                                  },
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_6c018570",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": "default",
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                                    "--input-height": "var(--input-height-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "div",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                            ],
-                                                            "props": {
-                                                              "className": "m_46b77525",
-                                                              "data-size": "sm",
-                                                              "data-variant": undefined,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                            },
-                                                            "type": "div",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "rjsf-field rjsf-field-string",
-                                                          "style": undefined,
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": [
-                                                              {
-                                                                "children": [
-                                                                  "city",
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_8fdc1311",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": undefined,
-                                                                  "htmlFor": "root_person_address_city",
-                                                                  "id": "root_person_address_city-label",
-                                                                  "onMouseDown": [Function],
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "label",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                              {
-                                                                "children": [
-                                                                  {
-                                                                    "children": null,
-                                                                    "props": {
-                                                                      "aria-describedby": undefined,
-                                                                      "aria-invalid": false,
-                                                                      "autoFocus": false,
-                                                                      "className": "m_8fb7ebe7",
-                                                                      "data-size": undefined,
-                                                                      "data-variant": "default",
-                                                                      "disabled": false,
-                                                                      "id": "root_person_address_city",
-                                                                      "name": "root.person.address.city",
-                                                                      "onBlur": [Function],
-                                                                      "onChange": [Function],
-                                                                      "onFocus": [Function],
-                                                                      "placeholder": "",
-                                                                      "required": false,
-                                                                      "size": undefined,
-                                                                      "style": {},
-                                                                      "type": "text",
-                                                                    },
-                                                                    "type": "input",
-                                                                    Symbol(cleaned): true,
-                                                                  },
-                                                                ],
-                                                                "props": {
-                                                                  "className": "m_6c018570",
-                                                                  "data-size": "sm",
-                                                                  "data-variant": "default",
-                                                                  "size": undefined,
-                                                                  "style": {
-                                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                                    "--input-height": "var(--input-height-sm)",
-                                                                  },
-                                                                },
-                                                                "type": "div",
-                                                                Symbol(cleaned): true,
-                                                              },
-                                                            ],
-                                                            "props": {
-                                                              "className": "m_46b77525",
-                                                              "data-size": "sm",
-                                                              "data-variant": undefined,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                            },
-                                                            "type": "div",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "rjsf-field rjsf-field-string",
-                                                          "style": undefined,
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_2415a157 __m__-ri2",
-                                                  "data-size": undefined,
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "marginBottom": "var(--mantine-spacing-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_7485cace",
-                                              "data-size": undefined,
-                                              "data-strategy": "block",
-                                              "data-variant": undefined,
-                                              "id": "root_person_address",
-                                              "size": undefined,
-                                              "style": {
-                                                "padding": "0rem",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "rjsf-field rjsf-field-object",
-                                          "style": undefined,
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_2415a157 __m__-rhn",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "marginBottom": "var(--mantine-spacing-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_7485cace",
-                              "data-size": undefined,
-                              "data-strategy": "block",
-                              "data-variant": undefined,
-                              "id": "root_person",
-                              "size": undefined,
-                              "style": {
-                                "padding": "0rem",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-object",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rhi",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rhi{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rhi"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-object"
+            >
+              <div
+                class="m_7485cace mantine-Container-root"
+                data-strategy="block"
+                id="root_person"
+                style="padding: 0rem;"
+              >
+                <h3
+                  class="m_8a5d1357 mantine-Title-root"
+                  data-order="3"
+                  id="root_person__title"
+                  style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+                >
+                  person
+                </h3>
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-rhn{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+                </style>
+                <div
+                  class="m_2415a157 mantine-SimpleGrid-root __m__-rhn"
+                  style="margin-bottom: var(--mantine-spacing-sm);"
+                >
+                  <div
+                    class=""
+                  >
+                    <div
+                      class="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_person_name"
+                          id="root_person_name-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          name
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_person_name"
+                            name="root.person.name"
+                            placeholder=""
+                            type="text"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class=""
+                  >
+                    <div
+                      class="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        class="m_7485cace mantine-Container-root"
+                        data-strategy="block"
+                        id="root_person_address"
+                        style="padding: 0rem;"
+                      >
+                        <h3
+                          class="m_8a5d1357 mantine-Title-root"
+                          data-order="3"
+                          id="root_person_address__title"
+                          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+                        >
+                          address
+                        </h3>
+                        <style
+                          data-mantine-styles="inline"
+                        >
+                          .__m__-ri2{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+                        </style>
+                        <div
+                          class="m_2415a157 mantine-SimpleGrid-root __m__-ri2"
+                          style="margin-bottom: var(--mantine-spacing-sm);"
+                        >
+                          <div
+                            class=""
+                          >
+                            <div
+                              class="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                                data-size="sm"
+                              >
+                                <label
+                                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                                  data-size="sm"
+                                  for="root_person_address_street"
+                                  id="root_person_address_street-label"
+                                  style="--input-label-size: var(--mantine-font-size-sm);"
+                                >
+                                  street
+                                </label>
+                                <div
+                                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                                  data-size="sm"
+                                  data-variant="default"
+                                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                                >
+                                  <input
+                                    aria-invalid="false"
+                                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                    data-variant="default"
+                                    id="root_person_address_street"
+                                    name="root.person.address.street"
+                                    placeholder=""
+                                    type="text"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            class=""
+                          >
+                            <div
+                              class="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                                data-size="sm"
+                              >
+                                <label
+                                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                                  data-size="sm"
+                                  for="root_person_address_city"
+                                  id="root_person_address_city-label"
+                                  style="--input-label-size: var(--mantine-font-size-sm);"
+                                >
+                                  city
+                                </label>
+                                <div
+                                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                                  data-size="sm"
+                                  data-variant="default"
+                                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                                >
+                                  <input
+                                    aria-invalid="false"
+                                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                    data-variant="default"
+                                    id="root_person_address_city"
+                                    name="root.person.address.city"
+                                    placeholder=""
+                                    type="text"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rij{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "name",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_name",
-                                  "id": "root_name-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_name",
-                                      "name": "root.name",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "Test",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "count",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_count",
-                                  "id": "root_count-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_count",
-                                      "inputMode": "numeric",
-                                      "name": "root.count",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "5",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      "items",
-                                    ],
-                                    "props": {
-                                      "className": "m_8a5d1357",
-                                      "data-order": 4,
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "id": "root_items__title",
-                                      "size": undefined,
-                                      "style": {
-                                        "--title-fw": "var(--mantine-h4-font-weight)",
-                                        "--title-fz": "var(--mantine-h4-font-size)",
-                                        "--title-lh": "var(--mantine-h4-line-height)",
-                                        "fontWeight": "normal",
-                                      },
-                                    },
-                                    "type": "h4",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_90794832",
-                                  "style": {},
-                                },
-                                "type": "legend",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          "items-0",
-                                                          {
-                                                            "children": [
-                                                              " *",
-                                                            ],
-                                                            "props": {
-                                                              "aria-hidden": true,
-                                                              "className": "m_78a94662",
-                                                              "style": {},
-                                                            },
-                                                            "type": "span",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_8fdc1311",
-                                                          "data-required": true,
-                                                          "data-size": "sm",
-                                                          "data-variant": undefined,
-                                                          "htmlFor": "root_items_0",
-                                                          "id": "root_items_0-label",
-                                                          "onMouseDown": [Function],
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-label-size": "var(--mantine-font-size-sm)",
-                                                          },
-                                                        },
-                                                        "type": "label",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "aria-describedby": undefined,
-                                                              "aria-invalid": false,
-                                                              "autoFocus": false,
-                                                              "className": "m_8fb7ebe7",
-                                                              "data-size": undefined,
-                                                              "data-variant": "default",
-                                                              "disabled": false,
-                                                              "id": "root_items_0",
-                                                              "name": "root.items.0",
-                                                              "onBlur": [Function],
-                                                              "onChange": [Function],
-                                                              "onFocus": [Function],
-                                                              "placeholder": "",
-                                                              "required": true,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                              "type": "text",
-                                                              "value": "a",
-                                                            },
-                                                            "type": "input",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_6c018570",
-                                                          "data-size": "sm",
-                                                          "data-variant": "default",
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-fz": "var(--mantine-font-size-sm)",
-                                                            "--input-height": "var(--input-height-sm)",
-                                                          },
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_46b77525",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-field rjsf-field-string",
-                                                  "style": undefined,
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "width": "100%",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 15l6 -6l6 6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-up",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-up m_8d3f4000 m_87cf2631",
-                                                  "data-disabled": true,
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "disabled": true,
-                                                  "id": "root_items_0__moveUp",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move up",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 9l6 6l6 -6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-down m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_items_0__moveDown",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move down",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M18 6l-12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 6l12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_items_0__remove",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Remove",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_4081bf90",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "--group-align": "center",
-                                                "--group-gap": "calc(0.125rem * var(--mantine-scale))",
-                                                "--group-justify": "flex-start",
-                                                "--group-wrap": "nowrap",
-                                                "marginBottom": "calc(0.4375rem * var(--mantine-scale))",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8bffd616 __m__-rj8",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {
-                                            "alignItems": "end",
-                                            "gap": "var(--mantine-spacing-xs)",
-                                            "justifyContent": "center",
-                                          },
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {
-                                        "marginBottom": "var(--mantine-spacing-xs)",
-                                      },
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          "items-1",
-                                                          {
-                                                            "children": [
-                                                              " *",
-                                                            ],
-                                                            "props": {
-                                                              "aria-hidden": true,
-                                                              "className": "m_78a94662",
-                                                              "style": {},
-                                                            },
-                                                            "type": "span",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_8fdc1311",
-                                                          "data-required": true,
-                                                          "data-size": "sm",
-                                                          "data-variant": undefined,
-                                                          "htmlFor": "root_items_1",
-                                                          "id": "root_items_1-label",
-                                                          "onMouseDown": [Function],
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-label-size": "var(--mantine-font-size-sm)",
-                                                          },
-                                                        },
-                                                        "type": "label",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "aria-describedby": undefined,
-                                                              "aria-invalid": false,
-                                                              "autoFocus": false,
-                                                              "className": "m_8fb7ebe7",
-                                                              "data-size": undefined,
-                                                              "data-variant": "default",
-                                                              "disabled": false,
-                                                              "id": "root_items_1",
-                                                              "name": "root.items.1",
-                                                              "onBlur": [Function],
-                                                              "onChange": [Function],
-                                                              "onFocus": [Function],
-                                                              "placeholder": "",
-                                                              "required": true,
-                                                              "size": undefined,
-                                                              "style": {},
-                                                              "type": "text",
-                                                              "value": "b",
-                                                            },
-                                                            "type": "input",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "m_6c018570",
-                                                          "data-size": "sm",
-                                                          "data-variant": "default",
-                                                          "size": undefined,
-                                                          "style": {
-                                                            "--input-fz": "var(--mantine-font-size-sm)",
-                                                            "--input-height": "var(--input-height-sm)",
-                                                          },
-                                                        },
-                                                        "type": "div",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_46b77525",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-field rjsf-field-string",
-                                                  "style": undefined,
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "width": "100%",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 15l6 -6l6 6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-up",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-up m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_items_1__moveUp",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move up",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 9l6 6l6 -6",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-chevron-down",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-move-down m_8d3f4000 m_87cf2631",
-                                                  "data-disabled": true,
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "disabled": true,
-                                                  "id": "root_items_1__moveDown",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-blue-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Move down",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": [
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M0 0h24v24H0z",
-                                                              "fill": "none",
-                                                              "stroke": "none",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M18 6l-12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                          {
-                                                            "children": null,
-                                                            "props": {
-                                                              "d": "M6 6l12 12",
-                                                            },
-                                                            "type": "path",
-                                                            Symbol(cleaned): true,
-                                                          },
-                                                        ],
-                                                        "props": {
-                                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                                          "fill": "none",
-                                                          "height": "24",
-                                                          "stroke": "currentColor",
-                                                          "strokeLinecap": "round",
-                                                          "strokeLinejoin": "round",
-                                                          "strokeWidth": "2",
-                                                          "style": {
-                                                            "height": undefined,
-                                                            "width": undefined,
-                                                          },
-                                                          "viewBox": "0 0 24 24",
-                                                          "width": "24",
-                                                          "xmlns": "http://www.w3.org/2000/svg",
-                                                        },
-                                                        "type": "svg",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8d3afb97",
-                                                      "data-size": undefined,
-                                                      "data-variant": undefined,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                    },
-                                                    "type": "span",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                                  "data-size": "sm",
-                                                  "data-variant": "subtle",
-                                                  "id": "root_items_1__remove",
-                                                  "onClick": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                                    "--ai-bg": "transparent",
-                                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                                    "--ai-size": "var(--ai-size-sm)",
-                                                  },
-                                                  "title": "Remove",
-                                                  "type": "button",
-                                                },
-                                                "type": "button",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_4081bf90",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {
-                                                "--group-align": "center",
-                                                "--group-gap": "calc(0.125rem * var(--mantine-scale))",
-                                                "--group-justify": "flex-start",
-                                                "--group-wrap": "nowrap",
-                                                "marginBottom": "calc(0.4375rem * var(--mantine-scale))",
-                                              },
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8bffd616 __m__-rjo",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {
-                                            "alignItems": "end",
-                                            "gap": "var(--mantine-spacing-xs)",
-                                            "justifyContent": "center",
-                                          },
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {
-                                        "marginBottom": "var(--mantine-spacing-xs)",
-                                      },
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "row rjsf-array-item-list",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {},
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M0 0h24v24H0z",
-                                                  "fill": "none",
-                                                  "stroke": "none",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M12 5l0 14",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": null,
-                                                "props": {
-                                                  "d": "M5 12l14 0",
-                                                },
-                                                "type": "path",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                                              "fill": "none",
-                                              "height": "24",
-                                              "stroke": "currentColor",
-                                              "strokeLinecap": "round",
-                                              "strokeLinejoin": "round",
-                                              "strokeWidth": "2",
-                                              "style": {
-                                                "height": undefined,
-                                                "width": undefined,
-                                              },
-                                              "viewBox": "0 0 24 24",
-                                              "width": "24",
-                                              "xmlns": "http://www.w3.org/2000/svg",
-                                            },
-                                            "type": "svg",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_8d3afb97",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "span",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "rjsf-array-item-add m_8d3f4000 m_87cf2631",
-                                      "data-size": "md",
-                                      "data-variant": "subtle",
-                                      "id": "root_items__add",
-                                      "onClick": [Function],
-                                      "size": undefined,
-                                      "style": {
-                                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                        "--ai-bg": "transparent",
-                                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                                        "--ai-size": "var(--ai-size-md)",
-                                      },
-                                      "title": "Add Item",
-                                      "type": "button",
-                                    },
-                                    "type": "button",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_4081bf90",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--group-align": "center",
-                                    "--group-gap": "var(--mantine-spacing-md)",
-                                    "--group-justify": "flex-end",
-                                    "--group-wrap": "wrap",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_84c9523a rjsf-field rjsf-field-array rjsf-field-array-of-string m_e9408a47",
-                              "data-size": undefined,
-                              "data-variant": "default",
-                              "id": "root_items",
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "fieldset",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-array",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rij",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rij{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rij"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_name"
+                  id="root_name-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  name
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_name"
+                    name="root.name"
+                    placeholder=""
+                    type="text"
+                    value="Test"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_count"
+                  id="root_count-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  count
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_count"
+                    inputmode="numeric"
+                    name="root.count"
+                    placeholder=""
+                    type="text"
+                    value="5"
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                class="m_84c9523a rjsf-field rjsf-field-array rjsf-field-array-of-string m_e9408a47 mantine-Fieldset-root"
+                data-variant="default"
+                id="root_items"
+              >
+                <legend
+                  class="m_90794832 mantine-Fieldset-legend"
+                >
+                  <h4
+                    class="m_8a5d1357 mantine-Title-root"
+                    data-order="4"
+                    id="root_items__title"
+                    style="--title-fw: var(--mantine-h4-font-weight); --title-lh: var(--mantine-h4-line-height); --title-fz: var(--mantine-h4-font-size); font-weight: normal;"
+                  >
+                    items
+                  </h4>
+                </legend>
+                <div
+                  class="row rjsf-array-item-list"
+                >
+                  <div
+                    class="rjsf-array-item"
+                    style="margin-bottom: var(--mantine-spacing-xs);"
+                  >
+                    <div
+                      class="m_8bffd616 mantine-Flex-root __m__-rj8"
+                      style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+                    >
+                      <div
+                        class=""
+                        style="width: 100%;"
+                      >
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                            data-size="sm"
+                          >
+                            <label
+                              class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                              data-required="true"
+                              data-size="sm"
+                              for="root_items_0"
+                              id="root_items_0-label"
+                              style="--input-label-size: var(--mantine-font-size-sm);"
+                            >
+                              items-0
+                              <span
+                                aria-hidden="true"
+                                class="m_78a94662 mantine-InputWrapper-required mantine-TextInput-required"
+                              >
+                                 *
+                              </span>
+                            </label>
+                            <div
+                              class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                              data-size="sm"
+                              data-variant="default"
+                              style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                            >
+                              <input
+                                aria-invalid="false"
+                                class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                data-variant="default"
+                                id="root_items_0"
+                                name="root.items.0"
+                                placeholder=""
+                                required=""
+                                type="text"
+                                value="a"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        class="m_4081bf90 mantine-Group-root"
+                        style="--group-gap: calc(0.125rem * var(--mantine-scale)); --group-align: center; --group-justify: flex-start; --group-wrap: nowrap; margin-bottom: calc(0.4375rem * var(--mantine-scale));"
+                      >
+                        <button
+                          class="mantine-focus-auto rjsf-array-item-move-up m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-disabled="true"
+                          data-size="sm"
+                          data-variant="subtle"
+                          disabled=""
+                          id="root_items_0__moveUp"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move up"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-up"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 15l6 -6l6 6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-move-down m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_items_0__moveDown"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move down"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-down"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 9l6 6l6 -6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_items_0__remove"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Remove"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M18 6l-12 12"
+                              />
+                              <path
+                                d="M6 6l12 12"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    class="rjsf-array-item"
+                    style="margin-bottom: var(--mantine-spacing-xs);"
+                  >
+                    <div
+                      class="m_8bffd616 mantine-Flex-root __m__-rjo"
+                      style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+                    >
+                      <div
+                        class=""
+                        style="width: 100%;"
+                      >
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                            data-size="sm"
+                          >
+                            <label
+                              class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                              data-required="true"
+                              data-size="sm"
+                              for="root_items_1"
+                              id="root_items_1-label"
+                              style="--input-label-size: var(--mantine-font-size-sm);"
+                            >
+                              items-1
+                              <span
+                                aria-hidden="true"
+                                class="m_78a94662 mantine-InputWrapper-required mantine-TextInput-required"
+                              >
+                                 *
+                              </span>
+                            </label>
+                            <div
+                              class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                              data-size="sm"
+                              data-variant="default"
+                              style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                            >
+                              <input
+                                aria-invalid="false"
+                                class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                                data-variant="default"
+                                id="root_items_1"
+                                name="root.items.1"
+                                placeholder=""
+                                required=""
+                                type="text"
+                                value="b"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        class="m_4081bf90 mantine-Group-root"
+                        style="--group-gap: calc(0.125rem * var(--mantine-scale)); --group-align: center; --group-justify: flex-start; --group-wrap: nowrap; margin-bottom: calc(0.4375rem * var(--mantine-scale));"
+                      >
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-move-up m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_items_1__moveUp"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move up"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-up"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 15l6 -6l6 6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto rjsf-array-item-move-down m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-disabled="true"
+                          data-size="sm"
+                          data-variant="subtle"
+                          disabled=""
+                          id="root_items_1__moveDown"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Move down"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-down"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M6 9l6 6l6 -6"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                        <button
+                          class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                          data-size="sm"
+                          data-variant="subtle"
+                          id="root_items_1__remove"
+                          style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                          title="Remove"
+                          type="button"
+                        >
+                          <span
+                            class="m_8d3afb97 mantine-ActionIcon-icon"
+                          >
+                            <svg
+                              class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                              fill="none"
+                              height="24"
+                              stroke="currentColor"
+                              stroke-linecap="round"
+                              stroke-linejoin="round"
+                              stroke-width="2"
+                              viewBox="0 0 24 24"
+                              width="24"
+                              xmlns="http://www.w3.org/2000/svg"
+                            >
+                              <path
+                                d="M0 0h24v24H0z"
+                                fill="none"
+                                stroke="none"
+                              />
+                              <path
+                                d="M18 6l-12 12"
+                              />
+                              <path
+                                d="M6 6l12 12"
+                              />
+                            </svg>
+                          </span>
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  class="m_4081bf90 mantine-Group-root"
+                  style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap;"
+                >
+                  <button
+                    class="mantine-focus-auto mantine-active rjsf-array-item-add m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                    data-size="md"
+                    data-variant="subtle"
+                    id="root_items__add"
+                    style="--ai-size: var(--ai-size-md); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                    title="Add Item"
+                    type="button"
+                  >
+                    <span
+                      class="m_8d3afb97 mantine-ActionIcon-icon"
+                    >
+                      <svg
+                        class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                        fill="none"
+                        height="24"
+                        stroke="currentColor"
+                        stroke-linecap="round"
+                        stroke-linejoin="round"
+                        stroke-width="2"
+                        viewBox="0 0 24 24"
+                        width="24"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="M0 0h24v24H0z"
+                          fill="none"
+                          stroke="none"
+                        />
+                        <path
+                          d="M12 5l0 14"
+                        />
+                        <path
+                          d="M5 12l14 0"
+                        />
+                      </svg>
+                    </span>
+                  </button>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rgp{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "firstName",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_firstName",
-                                  "id": "root_firstName-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_firstName",
-                                      "name": "root.firstName",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "lastName",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_lastName",
-                                  "id": "root_lastName-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_lastName",
-                                      "name": "root.lastName",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "age",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_age",
-                                  "id": "root_age-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_age",
-                                      "inputMode": "numeric",
-                                      "name": "root.age",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rgp",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rgp{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rgp"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_firstName"
+                  id="root_firstName-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  firstName
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_firstName"
+                    name="root.firstName"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_lastName"
+                  id="root_lastName-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  lastName
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_lastName"
+                    name="root.lastName"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_age"
+                  id="root_age-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  age
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_age"
+                    inputmode="numeric"
+                    name="root.age"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rk{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-rp{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-rr{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "foo Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_foo-key",
-                                                      "id": "root_foo-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "foo",
-                                                          "disabled": false,
-                                                          "id": "root_foo-key",
-                                                          "name": "root_foo-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-rr",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r12{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "foo",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_foo",
-                                                  "id": "root_foo-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_foo",
-                                                      "name": "root_foo",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "foo",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r12",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-rp",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_foo__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-rn",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rk",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rk{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rk"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-rn"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-rp{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-rp"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-rr{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-rr"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_foo-key"
+                            id="root_foo-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            foo Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_foo-key"
+                              name="root_foo-key"
+                              value="foo"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r12{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r12"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_foo"
+                          id="root_foo-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          foo
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_foo"
+                            name="root_foo"
+                            placeholder=""
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_foo__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r1{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "A",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_a",
-                                  "id": "root_a-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_a",
-                                      "name": "root_a",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "B",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_b",
-                                  "id": "root_b-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_b",
-                                      "inputMode": "numeric",
-                                      "name": "root_b",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r1",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r1{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r1"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_a"
+                  id="root_a-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  A
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_b"
+                  id="root_b-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  B
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_b"
+                    inputmode="numeric"
+                    name="root_b"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r1h{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r1m{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r1o{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "additionalProperty Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_additionalProperty-key",
-                                                      "id": "root_additionalProperty-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "additionalProperty",
-                                                          "disabled": false,
-                                                          "id": "root_additionalProperty-key",
-                                                          "name": "root_additionalProperty-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r1o",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r1v{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "additionalProperty",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_additionalProperty",
-                                                  "id": "root_additionalProperty-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_additionalProperty",
-                                                      "name": "root_additionalProperty",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "should appear",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r1v",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r1m",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_additionalProperty__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r1k",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r1h",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r1h{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r1h"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r1k"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r1m{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r1m"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r1o{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r1o"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_additionalProperty-key"
+                            id="root_additionalProperty-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            additionalProperty Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_additionalProperty-key"
+                              name="root_additionalProperty-key"
+                              value="additionalProperty"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r1v{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r1v"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_additionalProperty"
+                          id="root_additionalProperty-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          additionalProperty
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_additionalProperty"
+                            name="root_additionalProperty"
+                            placeholder=""
+                            type="text"
+                            value="should appear"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_additionalProperty__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Test field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a test description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r35{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r3a{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r3c{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "foo Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_foo-key",
-                                                      "id": "root_foo-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "foo",
-                                                          "disabled": false,
-                                                          "id": "root_foo-key",
-                                                          "name": "root_foo-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r3c",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r3j{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "foo",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_foo",
-                                                  "id": "root_foo-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_foo",
-                                                      "name": "root_foo",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "foo",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r3j",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r3a",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_foo__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r38",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r35",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          Test field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a test description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r35{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r35"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r38"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r3a{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r3a"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r3c{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r3c"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_foo-key"
+                            id="root_foo-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            foo Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_foo-key"
+                              name="root_foo-key"
+                              value="foo"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r3j{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r3j"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_foo"
+                          id="root_foo-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          foo
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_foo"
+                            name="root_foo"
+                            placeholder=""
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_foo__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "My Field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a fancier description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r8f{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r8k{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r8m{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "foo Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_foo-key",
-                                                      "id": "root_foo-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "foo",
-                                                          "disabled": false,
-                                                          "id": "root_foo-key",
-                                                          "name": "root_foo-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r8m",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r8t{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "foo",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_foo",
-                                                  "id": "root_foo-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_foo",
-                                                      "name": "root_foo",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "foo",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r8t",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r8k",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_foo__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r8i",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r8f",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          My Field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a fancier description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r8f{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r8f"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r8i"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r8k{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r8k"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r8m{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r8m"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_foo-key"
+                            id="root_foo-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            foo Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_foo-key"
+                              name="root_foo-key"
+                              value="foo"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r8t{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r8t"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_foo"
+                          id="root_foo-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          foo
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_foo"
+                            name="root_foo"
+                            placeholder=""
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_foo__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "My Field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a fancier description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r7o{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "My Item A",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_a",
-                                  "id": "root_a-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  "a fancier item A description",
-                                ],
-                                "props": {
-                                  "className": "m_fe47ce59",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "id": "root_a-description",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-description-size": "calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)))",
-                                  },
-                                },
-                                "type": "p",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": "root_a-description",
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_a",
-                                      "name": "root_a",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-margin-top": "calc(var(--mantine-spacing-xs) / 2)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "My Item B",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_b",
-                                  "id": "root_b-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  "a fancier item B description",
-                                ],
-                                "props": {
-                                  "className": "m_fe47ce59",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "id": "root_b-description",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-description-size": "calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)))",
-                                  },
-                                },
-                                "type": "p",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": "root_b-description",
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_b",
-                                      "inputMode": "numeric",
-                                      "name": "root_b",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-margin-top": "calc(var(--mantine-spacing-xs) / 2)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r7o",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          My Field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a fancier description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r7o{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r7o"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_a"
+                  id="root_a-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  My Item A
+                </label>
+                <p
+                  class="m_fe47ce59 mantine-InputWrapper-description mantine-TextInput-description"
+                  data-size="sm"
+                  id="root_a-description"
+                  style="--input-description-size: calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)));"
+                >
+                  a fancier item A description
+                </p>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-margin-top: calc(var(--mantine-spacing-xs) / 2); --input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-describedby="root_a-description"
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_b"
+                  id="root_b-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  My Item B
+                </label>
+                <p
+                  class="m_fe47ce59 mantine-InputWrapper-description mantine-NumberInput-description"
+                  data-size="sm"
+                  id="root_b-description"
+                  style="--input-description-size: calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)));"
+                >
+                  a fancier item B description
+                </p>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-margin-top: calc(var(--mantine-spacing-xs) / 2); --input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-describedby="root_b-description"
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_b"
+                    inputmode="numeric"
+                    name="root_b"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "My Field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a fancier description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r5q{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r5v{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r61{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "foo Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_foo-key",
-                                                      "id": "root_foo-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "foo",
-                                                          "disabled": false,
-                                                          "id": "root_foo-key",
-                                                          "name": "root_foo-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r61",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r68{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "foo",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_foo",
-                                                  "id": "root_foo-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_foo",
-                                                      "name": "root_foo",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "foo",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r68",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r5v",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_foo__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r5t",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r5q",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          My Field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a fancier description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r5q{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r5q"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r5t"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r5v{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r5v"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r61{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r61"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_foo-key"
+                            id="root_foo-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            foo Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_foo-key"
+                              name="root_foo-key"
+                              value="foo"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r68{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r68"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_foo"
+                          id="root_foo-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          foo
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_foo"
+                            name="root_foo"
+                            placeholder=""
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_foo__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "My Field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a fancier description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r53{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "My Item A",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_a",
-                                  "id": "root_a-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  "a fancier item A description",
-                                ],
-                                "props": {
-                                  "className": "m_fe47ce59",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "id": "root_a-description",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-description-size": "calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)))",
-                                  },
-                                },
-                                "type": "p",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": "root_a-description",
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_a",
-                                      "name": "root_a",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-margin-top": "calc(var(--mantine-spacing-xs) / 2)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "My Item B",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_b",
-                                  "id": "root_b-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  "a fancier item B description",
-                                ],
-                                "props": {
-                                  "className": "m_fe47ce59",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "id": "root_b-description",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-description-size": "calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)))",
-                                  },
-                                },
-                                "type": "p",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": "root_b-description",
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_b",
-                                      "inputMode": "numeric",
-                                      "name": "root_b",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-margin-top": "calc(var(--mantine-spacing-xs) / 2)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r53",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          My Field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a fancier description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r53{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r53"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_a"
+                  id="root_a-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  My Item A
+                </label>
+                <p
+                  class="m_fe47ce59 mantine-InputWrapper-description mantine-TextInput-description"
+                  data-size="sm"
+                  id="root_a-description"
+                  style="--input-description-size: calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)));"
+                >
+                  a fancier item A description
+                </p>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-margin-top: calc(var(--mantine-spacing-xs) / 2); --input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-describedby="root_a-description"
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_b"
+                  id="root_b-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  My Item B
+                </label>
+                <p
+                  class="m_fe47ce59 mantine-InputWrapper-description mantine-NumberInput-description"
+                  data-size="sm"
+                  id="root_b-description"
+                  style="--input-description-size: calc(var(--mantine-font-size-sm) - calc(0.125rem * var(--mantine-scale)));"
+                >
+                  a fancier item B description
+                </p>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-margin-top: calc(var(--mantine-spacing-xs) / 2); --input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-describedby="root_b-description"
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_b"
+                    inputmode="numeric"
+                    name="root_b"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "My Field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a fancier description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r6p{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r6u{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r70{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "additionalProperty Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_additionalProperty-key",
-                                                      "id": "root_additionalProperty-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "additionalProperty",
-                                                          "disabled": false,
-                                                          "id": "root_additionalProperty-key",
-                                                          "name": "root_additionalProperty-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r70",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r77{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "additionalProperty",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_additionalProperty",
-                                                  "id": "root_additionalProperty-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_additionalProperty",
-                                                      "name": "root_additionalProperty",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "should appear",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r77",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r6u",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_additionalProperty__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r6s",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r6p",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          My Field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a fancier description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r6p{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r6p"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r6s"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r6u{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r6u"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r70{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r70"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_additionalProperty-key"
+                            id="root_additionalProperty-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            additionalProperty Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_additionalProperty-key"
+                              name="root_additionalProperty-key"
+                              value="additionalProperty"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r77{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r77"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_additionalProperty"
+                          id="root_additionalProperty-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          additionalProperty
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_additionalProperty"
+                            name="root_additionalProperty"
+                            placeholder=""
+                            type="text"
+                            value="should appear"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_additionalProperty__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Test field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a test description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r2g{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "A",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_a",
-                                  "id": "root_a-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_a",
-                                      "name": "root_a",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  "B",
-                                ],
-                                "props": {
-                                  "className": "m_8fdc1311",
-                                  "data-size": "sm",
-                                  "data-variant": undefined,
-                                  "htmlFor": "root_b",
-                                  "id": "root_b-label",
-                                  "onMouseDown": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                  },
-                                },
-                                "type": "label",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_b",
-                                      "inputMode": "numeric",
-                                      "name": "root_b",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r2g",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          Test field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a test description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r2g{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r2g"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                  data-size="sm"
+                  for="root_a"
+                  id="root_a-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  A
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <label
+                  class="m_8fdc1311 mantine-InputWrapper-label mantine-NumberInput-label"
+                  data-size="sm"
+                  for="root_b"
+                  id="root_b-label"
+                  style="--input-label-size: var(--mantine-font-size-sm);"
+                >
+                  B
+                </label>
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_b"
+                    inputmode="numeric"
+                    name="root_b"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Test field",
-                ],
-                "props": {
-                  "className": "m_8a5d1357",
-                  "data-order": 3,
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__title",
-                  "size": undefined,
-                  "style": {
-                    "--title-fw": "var(--mantine-h3-font-weight)",
-                    "--title-fz": "var(--mantine-h3-font-size)",
-                    "--title-lh": "var(--mantine-h3-line-height)",
-                    "fontWeight": "normal",
-                  },
-                },
-                "type": "h3",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  "a test description",
-                ],
-                "props": {
-                  "className": "m_b6d8b162",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "id": "root__description",
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                    "marginTop": "calc(0.1875rem * var(--mantine-scale))",
-                  },
-                },
-                "type": "p",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r44{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-r49{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r4b{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "additionalProperty Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_additionalProperty-key",
-                                                      "id": "root_additionalProperty-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "additionalProperty",
-                                                          "disabled": false,
-                                                          "id": "root_additionalProperty-key",
-                                                          "name": "root_additionalProperty-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r4b",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-r4i{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  "additionalProperty",
-                                                ],
-                                                "props": {
-                                                  "className": "m_8fdc1311",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "htmlFor": "root_additionalProperty",
-                                                  "id": "root_additionalProperty-label",
-                                                  "onMouseDown": [Function],
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-label-size": "var(--mantine-font-size-sm)",
-                                                  },
-                                                },
-                                                "type": "label",
-                                                Symbol(cleaned): true,
-                                              },
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_additionalProperty",
-                                                      "name": "root_additionalProperty",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "should appear",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-r4i",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-r49",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_additionalProperty__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-r47",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r44",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <h3
+          class="m_8a5d1357 mantine-Title-root"
+          data-order="3"
+          id="root__title"
+          style="--title-fw: var(--mantine-h3-font-weight); --title-lh: var(--mantine-h3-line-height); --title-fz: var(--mantine-h3-font-size); font-weight: normal;"
+        >
+          Test field
+        </h3>
+        <p
+          class="mantine-focus-auto m_b6d8b162 mantine-Text-root"
+          id="root__description"
+          style="margin-top: calc(0.1875rem * var(--mantine-scale)); margin-bottom: var(--mantine-spacing-sm);"
+        >
+          a test description
+        </p>
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r44{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r44"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-r47"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-r49{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-r49"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r4b{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r4b"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_additionalProperty-key"
+                            id="root_additionalProperty-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            additionalProperty Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_additionalProperty-key"
+                              name="root_additionalProperty-key"
+                              value="additionalProperty"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-r4i{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-r4i"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <label
+                          class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                          data-size="sm"
+                          for="root_additionalProperty"
+                          id="root_additionalProperty-label"
+                          style="--input-label-size: var(--mantine-font-size-sm);"
+                        >
+                          additionalProperty
+                        </label>
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_additionalProperty"
+                            name="root_additionalProperty"
+                            placeholder=""
+                            type="text"
+                            value="should appear"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_additionalProperty__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r9t{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-ra2{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-ra4{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "foo Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_foo-key",
-                                                      "id": "root_foo-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "foo",
-                                                          "disabled": false,
-                                                          "id": "root_foo-key",
-                                                          "name": "root_foo-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-ra4",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-rab{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_foo",
-                                                      "name": "root_foo",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "foo",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-rab",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-ra2",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_foo__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-ra0",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r9t",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r9t{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r9t"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-ra0"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-ra2{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-ra2"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-ra4{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-ra4"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_foo-key"
+                            id="root_foo-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            foo Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_foo-key"
+                              name="root_foo-key"
+                              value="foo"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-rab{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-rab"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_foo"
+                            name="root_foo"
+                            placeholder=""
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_foo__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-r9c{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_a",
-                                      "name": "root_a",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": [
-                                  {
-                                    "children": null,
-                                    "props": {
-                                      "aria-describedby": undefined,
-                                      "aria-invalid": false,
-                                      "autoFocus": false,
-                                      "className": "m_8fb7ebe7",
-                                      "data-size": undefined,
-                                      "data-variant": "default",
-                                      "disabled": false,
-                                      "id": "root_b",
-                                      "inputMode": "numeric",
-                                      "name": "root_b",
-                                      "onBlur": [Function],
-                                      "onChange": [Function],
-                                      "onFocus": [Function],
-                                      "onKeyDown": [Function],
-                                      "onKeyDownCapture": [Function],
-                                      "onMouseUp": [Function],
-                                      "placeholder": "",
-                                      "required": false,
-                                      "size": undefined,
-                                      "style": {},
-                                      "type": "text",
-                                      "value": "",
-                                    },
-                                    "type": "input",
-                                    Symbol(cleaned): true,
-                                  },
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": "rotate(180deg)",
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "up",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "clipRule": "evenodd",
-                                                      "d": "M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z",
-                                                      "fill": "currentColor",
-                                                      "fillRule": "evenodd",
-                                                    },
-                                                    "type": "path",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "fill": "none",
-                                                  "style": {
-                                                    "height": "var(--ni-chevron-size)",
-                                                    "transform": undefined,
-                                                    "width": "var(--ni-chevron-size)",
-                                                  },
-                                                  "viewBox": "0 0 15 15",
-                                                  "xmlns": "http://www.w3.org/2000/svg",
-                                                },
-                                                "type": "svg",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "aria-hidden": true,
-                                              "className": "m_80b4b171 m_87cf2631",
-                                              "data-direction": "down",
-                                              "data-size": undefined,
-                                              "data-variant": undefined,
-                                              "disabled": false,
-                                              "onMouseDown": [Function],
-                                              "onPointerDown": [Function],
-                                              "onPointerLeave": [Function],
-                                              "onPointerUp": [Function],
-                                              "size": undefined,
-                                              "style": {},
-                                              "tabIndex": -1,
-                                              "type": "button",
-                                            },
-                                            "type": "button",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_95e17d22",
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_82577fc2",
-                                      "data-position": "right",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_6c018570",
-                                  "data-size": "sm",
-                                  "data-variant": "default",
-                                  "data-with-right-section": true,
-                                  "size": undefined,
-                                  "style": {
-                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                    "--input-height": "var(--input-height-sm)",
-                                    "--input-right-section-width": "var(--ni-right-section-width-sm)",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_e2f5cd4e m_46b77525",
-                              "data-size": "sm",
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {},
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-number",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-r9c",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-r9c{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-r9c"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                data-size="sm"
+              >
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                    data-variant="default"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
+                    type="text"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-number"
+            >
+              <div
+                class="m_e2f5cd4e m_46b77525 mantine-InputWrapper-root mantine-NumberInput-root"
+                data-size="sm"
+              >
+                <div
+                  class="m_6c018570 mantine-Input-wrapper mantine-NumberInput-wrapper"
+                  data-size="sm"
+                  data-variant="default"
+                  data-with-right-section="true"
+                  style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm); --input-right-section-width: var(--ni-right-section-width-sm);"
+                >
+                  <input
+                    aria-invalid="false"
+                    class="m_8fb7ebe7 mantine-Input-input mantine-NumberInput-input"
+                    data-variant="default"
+                    id="root_b"
+                    inputmode="numeric"
+                    name="root_b"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                  <div
+                    class="m_82577fc2 mantine-Input-section mantine-NumberInput-section"
+                    data-position="right"
+                  >
+                    <div
+                      class="m_95e17d22 mantine-NumberInput-controls"
+                    >
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="up"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size); transform: rotate(180deg);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                      <button
+                        aria-hidden="true"
+                        class="mantine-focus-auto m_80b4b171 mantine-NumberInput-control m_87cf2631 mantine-UnstyledButton-root"
+                        data-direction="down"
+                        tabindex="-1"
+                        type="button"
+                      >
+                        <svg
+                          fill="none"
+                          style="width: var(--ni-chevron-size); height: var(--ni-chevron-size);"
+                          viewBox="0 0 15 15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <path
+                            clip-rule="evenodd"
+                            d="M3.13523 6.15803C3.3241 5.95657 3.64052 5.94637 3.84197 6.13523L7.5 9.56464L11.158 6.13523C11.3595 5.94637 11.6759 5.95657 11.8648 6.15803C12.0536 6.35949 12.0434 6.67591 11.842 6.86477L7.84197 10.6148C7.64964 10.7951 7.35036 10.7951 7.15803 10.6148L3.15803 6.86477C2.95657 6.67591 2.94637 6.35949 3.13523 6.15803Z"
+                            fill="currentColor"
+                            fill-rule="evenodd"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-[
+<DocumentFragment>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "
+    data-mantine-styles="true"
+  >
+    
+
 
 
 
-",
-      }
-    }
-    data-mantine-styles={true}
-  />,
+  </style>
   <style
-    dangerouslySetInnerHTML={
-      {
-        "__html": "@media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}",
-      }
-    }
     data-mantine-styles="classes"
-  />,
-  {
-    "children": [
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": null,
-                "props": {
-                  "dangerouslySetInnerHTML": {
-                    "__html": ".__m__-rap{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}",
-                  },
-                  "data-mantine-styles": "inline",
-                  "nonce": undefined,
-                },
-                "type": "style",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "dangerouslySetInnerHTML": {
-                                    "__html": ".__m__-rau{--grid-gutter:var(--mantine-spacing-md);}",
-                                  },
-                                  "data-mantine-styles": "inline",
-                                  "nonce": undefined,
-                                },
-                                "type": "style",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-rb0{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": [
-                                                      "additionalProperty Key",
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_8fdc1311",
-                                                      "data-size": "sm",
-                                                      "data-variant": undefined,
-                                                      "htmlFor": "root_additionalProperty-key",
-                                                      "id": "root_additionalProperty-key-label",
-                                                      "onMouseDown": [Function],
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-label-size": "var(--mantine-font-size-sm)",
-                                                      },
-                                                    },
-                                                    "type": "label",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                  {
-                                                    "children": [
-                                                      {
-                                                        "children": null,
-                                                        "props": {
-                                                          "aria-describedby": undefined,
-                                                          "aria-invalid": false,
-                                                          "className": "m_8fb7ebe7",
-                                                          "data-size": undefined,
-                                                          "data-variant": "default",
-                                                          "defaultValue": "additionalProperty",
-                                                          "disabled": false,
-                                                          "id": "root_additionalProperty-key",
-                                                          "name": "root_additionalProperty-key",
-                                                          "onBlur": [Function],
-                                                          "required": false,
-                                                          "size": undefined,
-                                                          "style": {},
-                                                        },
-                                                        "type": "input",
-                                                        Symbol(cleaned): true,
-                                                      },
-                                                    ],
-                                                    "props": {
-                                                      "className": "m_6c018570",
-                                                      "data-size": "sm",
-                                                      "data-variant": "default",
-                                                      "size": undefined,
-                                                      "style": {
-                                                        "--input-fz": "var(--mantine-font-size-sm)",
-                                                        "--input-height": "var(--input-height-sm)",
-                                                      },
-                                                    },
-                                                    "type": "div",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "form-group m_46b77525",
-                                                  "data-size": "sm",
-                                                  "data-variant": undefined,
-                                                  "size": undefined,
-                                                  "style": {},
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "form-group",
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-rb0",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": null,
-                                        "props": {
-                                          "dangerouslySetInnerHTML": {
-                                            "__html": ".__m__-rb7{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}",
-                                          },
-                                          "data-mantine-styles": "inline",
-                                          "nonce": undefined,
-                                        },
-                                        "type": "style",
-                                        Symbol(cleaned): true,
-                                      },
-                                      {
-                                        "children": [
-                                          {
-                                            "children": [
-                                              {
-                                                "children": [
-                                                  {
-                                                    "children": null,
-                                                    "props": {
-                                                      "aria-describedby": undefined,
-                                                      "aria-invalid": false,
-                                                      "autoFocus": false,
-                                                      "className": "m_8fb7ebe7",
-                                                      "data-size": undefined,
-                                                      "data-variant": "default",
-                                                      "disabled": false,
-                                                      "id": "root_additionalProperty",
-                                                      "name": "root_additionalProperty",
-                                                      "onBlur": [Function],
-                                                      "onChange": [Function],
-                                                      "onFocus": [Function],
-                                                      "placeholder": "",
-                                                      "required": false,
-                                                      "size": undefined,
-                                                      "style": {},
-                                                      "type": "text",
-                                                      "value": "should appear",
-                                                    },
-                                                    "type": "input",
-                                                    Symbol(cleaned): true,
-                                                  },
-                                                ],
-                                                "props": {
-                                                  "className": "m_6c018570",
-                                                  "data-size": "sm",
-                                                  "data-variant": "default",
-                                                  "size": undefined,
-                                                  "style": {
-                                                    "--input-fz": "var(--mantine-font-size-sm)",
-                                                    "--input-height": "var(--input-height-sm)",
-                                                  },
-                                                },
-                                                "type": "div",
-                                                Symbol(cleaned): true,
-                                              },
-                                            ],
-                                            "props": {
-                                              "className": "m_46b77525",
-                                              "data-size": "sm",
-                                              "data-variant": undefined,
-                                              "size": undefined,
-                                              "style": {},
-                                            },
-                                            "type": "div",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "m_96bdd299 form-additional __m__-rb7",
-                                          "data-size": undefined,
-                                          "data-variant": undefined,
-                                          "size": undefined,
-                                          "style": {},
-                                        },
-                                        "type": "div",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_dee7bd2f",
-                                      "style": {},
-                                    },
-                                    "type": "div",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "m_410352e9 __m__-rau",
-                                  "data-size": undefined,
-                                  "data-variant": undefined,
-                                  "size": undefined,
-                                  "style": {
-                                    "--grid-align": "center",
-                                    "width": "100%",
-                                  },
-                                },
-                                "type": "div",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": [
-                                  {
-                                    "children": [
-                                      {
-                                        "children": [
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M0 0h24v24H0z",
-                                              "fill": "none",
-                                              "stroke": "none",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M18 6l-12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                          {
-                                            "children": null,
-                                            "props": {
-                                              "d": "M6 6l12 12",
-                                            },
-                                            "type": "path",
-                                            Symbol(cleaned): true,
-                                          },
-                                        ],
-                                        "props": {
-                                          "className": "icon icon-tabler icons-tabler-outline icon-tabler-x",
-                                          "fill": "none",
-                                          "height": "24",
-                                          "stroke": "currentColor",
-                                          "strokeLinecap": "round",
-                                          "strokeLinejoin": "round",
-                                          "strokeWidth": "2",
-                                          "style": {
-                                            "height": undefined,
-                                            "width": undefined,
-                                          },
-                                          "viewBox": "0 0 24 24",
-                                          "width": "24",
-                                          "xmlns": "http://www.w3.org/2000/svg",
-                                        },
-                                        "type": "svg",
-                                        Symbol(cleaned): true,
-                                      },
-                                    ],
-                                    "props": {
-                                      "className": "m_8d3afb97",
-                                      "data-size": undefined,
-                                      "data-variant": undefined,
-                                      "size": undefined,
-                                      "style": {},
-                                    },
-                                    "type": "span",
-                                    Symbol(cleaned): true,
-                                  },
-                                ],
-                                "props": {
-                                  "className": "rjsf-array-item-remove m_8d3f4000 m_87cf2631",
-                                  "data-size": "sm",
-                                  "data-variant": "subtle",
-                                  "id": "root_additionalProperty__remove",
-                                  "onClick": [Function],
-                                  "size": undefined,
-                                  "style": {
-                                    "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                                    "--ai-bg": "transparent",
-                                    "--ai-color": "var(--mantine-color-red-light-color)",
-                                    "--ai-hover": "var(--mantine-color-red-light-hover)",
-                                    "--ai-size": "var(--ai-size-sm)",
-                                  },
-                                  "title": "Remove",
-                                  "type": "button",
-                                },
-                                "type": "button",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "m_8bffd616 __m__-ras",
-                              "data-size": undefined,
-                              "data-variant": undefined,
-                              "size": undefined,
-                              "style": {
-                                "alignItems": "end",
-                                "gap": "var(--mantine-spacing-xs)",
-                                "justifyContent": "center",
-                              },
-                            },
-                            "type": "div",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "rjsf-field rjsf-field-string",
-                          "style": undefined,
-                        },
-                        "type": "div",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "",
-                      "data-size": undefined,
-                      "data-variant": undefined,
-                      "size": undefined,
-                      "style": {},
-                    },
-                    "type": "div",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_2415a157 __m__-rap",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "marginBottom": "var(--mantine-spacing-sm)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-              {
-                "children": [
-                  {
-                    "children": [
-                      {
-                        "children": [
-                          {
-                            "children": [
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M0 0h24v24H0z",
-                                  "fill": "none",
-                                  "stroke": "none",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M12 5l0 14",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                              {
-                                "children": null,
-                                "props": {
-                                  "d": "M5 12l14 0",
-                                },
-                                "type": "path",
-                                Symbol(cleaned): true,
-                              },
-                            ],
-                            "props": {
-                              "className": "icon icon-tabler icons-tabler-outline icon-tabler-plus",
-                              "fill": "none",
-                              "height": "24",
-                              "stroke": "currentColor",
-                              "strokeLinecap": "round",
-                              "strokeLinejoin": "round",
-                              "strokeWidth": "2",
-                              "style": {
-                                "height": undefined,
-                                "width": undefined,
-                              },
-                              "viewBox": "0 0 24 24",
-                              "width": "24",
-                              "xmlns": "http://www.w3.org/2000/svg",
-                            },
-                            "type": "svg",
-                            Symbol(cleaned): true,
-                          },
-                        ],
-                        "props": {
-                          "className": "m_8d3afb97",
-                          "data-size": undefined,
-                          "data-variant": undefined,
-                          "size": undefined,
-                          "style": {},
-                        },
-                        "type": "span",
-                        Symbol(cleaned): true,
-                      },
-                    ],
-                    "props": {
-                      "className": "rjsf-object-property-expand m_8d3f4000 m_87cf2631",
-                      "data-size": "sm",
-                      "data-variant": "subtle",
-                      "id": "root__add",
-                      "onClick": [Function],
-                      "size": undefined,
-                      "style": {
-                        "--ai-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-                        "--ai-bg": "transparent",
-                        "--ai-color": "var(--mantine-color-blue-light-color)",
-                        "--ai-hover": "var(--mantine-color-blue-light-hover)",
-                        "--ai-size": "var(--ai-size-sm)",
-                      },
-                      "title": "Add Item",
-                      "type": "button",
-                    },
-                    "type": "button",
-                    Symbol(cleaned): true,
-                  },
-                ],
-                "props": {
-                  "className": "m_4081bf90",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {
-                    "--group-align": "center",
-                    "--group-gap": "var(--mantine-spacing-md)",
-                    "--group-justify": "flex-end",
-                    "--group-wrap": "wrap",
-                    "marginTop": "var(--mantine-spacing-xs)",
-                  },
-                },
-                "type": "div",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_7485cace",
-              "data-size": undefined,
-              "data-strategy": "block",
-              "data-variant": undefined,
-              "id": "root",
-              "size": undefined,
-              "style": {
-                "padding": "0rem",
-              },
-            },
-            "type": "div",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "rjsf-field rjsf-field-object",
-          "style": undefined,
-        },
-        "type": "div",
-        Symbol(cleaned): true,
-      },
-      {
-        "children": [
-          {
-            "children": [
-              {
-                "children": [
-                  "Submit",
-                ],
-                "props": {
-                  "className": "m_811560b9",
-                  "data-size": undefined,
-                  "data-variant": undefined,
-                  "size": undefined,
-                  "style": {},
-                },
-                "type": "span",
-                Symbol(cleaned): true,
-              },
-            ],
-            "props": {
-              "className": "m_80f1301b",
-              "style": {},
-            },
-            "type": "span",
-            Symbol(cleaned): true,
-          },
-        ],
-        "props": {
-          "className": "m_77c9d27d m_87cf2631",
-          "data-size": undefined,
-          "data-variant": "filled",
-          "size": undefined,
-          "style": {
-            "--button-bd": "calc(0.0625rem * var(--mantine-scale)) solid transparent",
-            "--button-bg": "var(--mantine-color-blue-filled)",
-            "--button-color": "var(--mantine-color-white)",
-            "--button-hover": "var(--mantine-color-blue-filled-hover)",
-          },
-          "type": "submit",
-        },
-        "type": "button",
-        Symbol(cleaned): true,
-      },
-    ],
-    "props": {
-      "acceptCharset": undefined,
-      "action": undefined,
-      "as": undefined,
-      "autoComplete": undefined,
-      "className": "rjsf",
-      "encType": undefined,
-      "id": undefined,
-      "method": undefined,
-      "name": undefined,
-      "noValidate": false,
-      "onSubmit": [Function],
-      "target": undefined,
-    },
-    "type": "form",
-    Symbol(cleaned): true,
-  },
-]
+  >
+    @media (max-width: 35.99375em) {.mantine-visible-from-xs {display: none !important;}}@media (min-width: 36em) {.mantine-hidden-from-xs {display: none !important;}}@media (max-width: 47.99375em) {.mantine-visible-from-sm {display: none !important;}}@media (min-width: 48em) {.mantine-hidden-from-sm {display: none !important;}}@media (max-width: 61.99375em) {.mantine-visible-from-md {display: none !important;}}@media (min-width: 62em) {.mantine-hidden-from-md {display: none !important;}}@media (max-width: 74.99375em) {.mantine-visible-from-lg {display: none !important;}}@media (min-width: 75em) {.mantine-hidden-from-lg {display: none !important;}}@media (max-width: 87.99375em) {.mantine-visible-from-xl {display: none !important;}}@media (min-width: 88em) {.mantine-hidden-from-xl {display: none !important;}}
+  </style>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div
+        class="m_7485cace mantine-Container-root"
+        data-strategy="block"
+        id="root"
+        style="padding: 0rem;"
+      >
+        <style
+          data-mantine-styles="inline"
+        >
+          .__m__-rap{--sg-spacing-x:var(--mantine-spacing-md);--sg-spacing-y:var(--mantine-spacing-md);--sg-cols:1;}
+        </style>
+        <div
+          class="m_2415a157 mantine-SimpleGrid-root __m__-rap"
+          style="margin-bottom: var(--mantine-spacing-sm);"
+        >
+          <div
+            class=""
+          >
+            <div
+              class="rjsf-field rjsf-field-string"
+            >
+              <div
+                class="m_8bffd616 mantine-Flex-root __m__-ras"
+                style="gap: var(--mantine-spacing-xs); align-items: end; justify-content: center;"
+              >
+                <style
+                  data-mantine-styles="inline"
+                >
+                  .__m__-rau{--grid-gutter:var(--mantine-spacing-md);}
+                </style>
+                <div
+                  class="m_410352e9 mantine-Grid-root __m__-rau"
+                  style="--grid-align: center; width: 100%;"
+                >
+                  <div
+                    class="m_dee7bd2f mantine-Grid-inner"
+                  >
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-rb0{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-rb0"
+                    >
+                      <div
+                        class="form-group"
+                      >
+                        <div
+                          class="form-group m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                          data-size="sm"
+                        >
+                          <label
+                            class="m_8fdc1311 mantine-InputWrapper-label mantine-TextInput-label"
+                            data-size="sm"
+                            for="root_additionalProperty-key"
+                            id="root_additionalProperty-key-label"
+                            style="--input-label-size: var(--mantine-font-size-sm);"
+                          >
+                            additionalProperty Key
+                          </label>
+                          <div
+                            class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                            data-size="sm"
+                            data-variant="default"
+                            style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                          >
+                            <input
+                              aria-invalid="false"
+                              class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                              data-variant="default"
+                              id="root_additionalProperty-key"
+                              name="root_additionalProperty-key"
+                              value="additionalProperty"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <style
+                      data-mantine-styles="inline"
+                    >
+                      .__m__-rb7{--col-flex-grow:auto;--col-flex-basis:50%;--col-max-width:50%;}
+                    </style>
+                    <div
+                      class="m_96bdd299 mantine-Grid-col form-additional __m__-rb7"
+                    >
+                      <div
+                        class="m_46b77525 mantine-InputWrapper-root mantine-TextInput-root"
+                        data-size="sm"
+                      >
+                        <div
+                          class="m_6c018570 mantine-Input-wrapper mantine-TextInput-wrapper"
+                          data-size="sm"
+                          data-variant="default"
+                          style="--input-height: var(--input-height-sm); --input-fz: var(--mantine-font-size-sm);"
+                        >
+                          <input
+                            aria-invalid="false"
+                            class="m_8fb7ebe7 mantine-Input-input mantine-TextInput-input"
+                            data-variant="default"
+                            id="root_additionalProperty"
+                            name="root_additionalProperty"
+                            placeholder=""
+                            type="text"
+                            value="should appear"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <button
+                  class="mantine-focus-auto mantine-active rjsf-array-item-remove m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+                  data-size="sm"
+                  data-variant="subtle"
+                  id="root_additionalProperty__remove"
+                  style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-red-light-hover); --ai-color: var(--mantine-color-red-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+                  title="Remove"
+                  type="button"
+                >
+                  <span
+                    class="m_8d3afb97 mantine-ActionIcon-icon"
+                  >
+                    <svg
+                      class="icon icon-tabler icons-tabler-outline icon-tabler-x"
+                      fill="none"
+                      height="24"
+                      stroke="currentColor"
+                      stroke-linecap="round"
+                      stroke-linejoin="round"
+                      stroke-width="2"
+                      viewBox="0 0 24 24"
+                      width="24"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M0 0h24v24H0z"
+                        fill="none"
+                        stroke="none"
+                      />
+                      <path
+                        d="M18 6l-12 12"
+                      />
+                      <path
+                        d="M6 6l12 12"
+                      />
+                    </svg>
+                  </span>
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          class="m_4081bf90 mantine-Group-root"
+          style="--group-gap: var(--mantine-spacing-md); --group-align: center; --group-justify: flex-end; --group-wrap: wrap; margin-top: var(--mantine-spacing-xs);"
+        >
+          <button
+            class="mantine-focus-auto mantine-active rjsf-object-property-expand m_8d3f4000 mantine-ActionIcon-root m_87cf2631 mantine-UnstyledButton-root"
+            data-size="sm"
+            data-variant="subtle"
+            id="root__add"
+            style="--ai-size: var(--ai-size-sm); --ai-bg: transparent; --ai-hover: var(--mantine-color-blue-light-hover); --ai-color: var(--mantine-color-blue-light-color); --ai-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+            title="Add Item"
+            type="button"
+          >
+            <span
+              class="m_8d3afb97 mantine-ActionIcon-icon"
+            >
+              <svg
+                class="icon icon-tabler icons-tabler-outline icon-tabler-plus"
+                fill="none"
+                height="24"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="24"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M0 0h24v24H0z"
+                  fill="none"
+                  stroke="none"
+                />
+                <path
+                  d="M12 5l0 14"
+                />
+                <path
+                  d="M5 12l14 0"
+                />
+              </svg>
+            </span>
+          </button>
+        </div>
+      </div>
+    </div>
+    <button
+      class="mantine-focus-auto mantine-active m_77c9d27d mantine-Button-root m_87cf2631 mantine-UnstyledButton-root"
+      data-variant="filled"
+      style="--button-bg: var(--mantine-color-blue-filled); --button-hover: var(--mantine-color-blue-filled-hover); --button-color: var(--mantine-color-white); --button-bd: calc(0.0625rem * var(--mantine-scale)) solid transparent;"
+      type="submit"
+    >
+      <span
+        class="m_80f1301b mantine-Button-inner"
+      >
+        <span
+          class="m_811560b9 mantine-Button-label"
+        >
+          Submit
+        </span>
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/mui/test/__snapshots__/Object.test.tsx.snap b/packages/mui/test/__snapshots__/Object.test.tsx.snap
index 79bedd6537..e0865226fa 100644
--- a/packages/mui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/mui/test/__snapshots__/Object.test.tsx.snap
@@ -1,7 +1,8 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -461,343 +462,272 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-object"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                className="MuiBox-root emotion-4"
-                id="root_person__title"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <h5
-                  className="MuiTypography-root MuiTypography-h5 emotion-5"
-                  style={{}}
+                <div
+                  class="MuiBox-root emotion-4"
+                  id="root_person__title"
                 >
-                  person
-                </h5>
-                <hr
-                  className="MuiDivider-root MuiDivider-fullWidth emotion-6"
-                />
-              </div>
-              <div
-                className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-                style={
-                  {
-                    "marginTop": "10px",
-                  }
-                }
-              >
+                  <h5
+                    class="MuiTypography-root MuiTypography-h5 emotion-5"
+                  >
+                    person
+                  </h5>
+                  <hr
+                    class="MuiDivider-root MuiDivider-fullWidth emotion-6"
+                  />
+                </div>
                 <div
-                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
+                  class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                  style="margin-top: 10px;"
                 >
                   <div
-                    className="rjsf-field rjsf-field-string"
+                    class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      class="rjsf-field rjsf-field-string"
                     >
                       <div
-                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                       >
-                        <label
-                          className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                          data-shrink={false}
-                          htmlFor="root_person_name"
-                          id="root_person_name-label"
-                        >
-                          name
-                        </label>
                         <div
-                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                          onClick={[Function]}
+                          aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                          class="MuiFormControl-root MuiTextField-root emotion-10"
                         >
-                          <input
-                            aria-invalid={false}
-                            autoFocus={false}
-                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                            disabled={false}
-                            id="root_person_name"
-                            name="root[person][name]"
-                            onAnimationStart={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={false}
-                            type="text"
-                            value=""
-                          />
-                          <fieldset
-                            aria-hidden={true}
-                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          <label
+                            class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                            data-shrink="false"
+                            for="root_person_name"
+                            id="root_person_name-label"
+                          >
+                            name
+                          </label>
+                          <div
+                            class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
                           >
-                            <legend
-                              className="emotion-15"
+                            <input
+                              aria-invalid="false"
+                              class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                              id="root_person_name"
+                              name="root[person][name]"
+                              placeholder=""
+                              type="text"
+                              value=""
+                            />
+                            <fieldset
+                              aria-hidden="true"
+                              class="MuiOutlinedInput-notchedOutline emotion-14"
                             >
-                              <span>
-                                name
-                              </span>
-                            </legend>
-                          </fieldset>
+                              <legend
+                                class="emotion-15"
+                              >
+                                <span>
+                                  name
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
-                >
                   <div
-                    className="rjsf-field rjsf-field-object"
+                    class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      class="rjsf-field rjsf-field-object"
                     >
                       <div
-                        className="MuiBox-root emotion-4"
-                        id="root_person_address__title"
+                        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                       >
-                        <h5
-                          className="MuiTypography-root MuiTypography-h5 emotion-5"
-                          style={{}}
+                        <div
+                          class="MuiBox-root emotion-4"
+                          id="root_person_address__title"
                         >
-                          address
-                        </h5>
-                        <hr
-                          className="MuiDivider-root MuiDivider-fullWidth emotion-6"
-                        />
-                      </div>
-                      <div
-                        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-                        style={
-                          {
-                            "marginTop": "10px",
-                          }
-                        }
-                      >
+                          <h5
+                            class="MuiTypography-root MuiTypography-h5 emotion-5"
+                          >
+                            address
+                          </h5>
+                          <hr
+                            class="MuiDivider-root MuiDivider-fullWidth emotion-6"
+                          />
+                        </div>
                         <div
-                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
+                          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                          style="margin-top: 10px;"
                         >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              class="rjsf-field rjsf-field-string"
                             >
                               <div
-                                aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                className="MuiFormControl-root MuiTextField-root emotion-10"
+                                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                               >
-                                <label
-                                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                                  data-shrink={false}
-                                  htmlFor="root_person_address_street"
-                                  id="root_person_address_street-label"
-                                >
-                                  street
-                                </label>
                                 <div
-                                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                                  onClick={[Function]}
+                                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                  class="MuiFormControl-root MuiTextField-root emotion-10"
                                 >
-                                  <input
-                                    aria-invalid={false}
-                                    autoFocus={false}
-                                    className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                                    disabled={false}
-                                    id="root_person_address_street"
-                                    name="root[person][address][street]"
-                                    onAnimationStart={[Function]}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    required={false}
-                                    type="text"
-                                    value=""
-                                  />
-                                  <fieldset
-                                    aria-hidden={true}
-                                    className="MuiOutlinedInput-notchedOutline emotion-14"
+                                  <label
+                                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                                    data-shrink="false"
+                                    for="root_person_address_street"
+                                    id="root_person_address_street-label"
+                                  >
+                                    street
+                                  </label>
+                                  <div
+                                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
                                   >
-                                    <legend
-                                      className="emotion-15"
+                                    <input
+                                      aria-invalid="false"
+                                      class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                                      id="root_person_address_street"
+                                      name="root[person][address][street]"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <fieldset
+                                      aria-hidden="true"
+                                      class="MuiOutlinedInput-notchedOutline emotion-14"
                                     >
-                                      <span>
-                                        street
-                                      </span>
-                                    </legend>
-                                  </fieldset>
+                                      <legend
+                                        class="emotion-15"
+                                      >
+                                        <span>
+                                          street
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              class="rjsf-field rjsf-field-string"
                             >
                               <div
-                                aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                className="MuiFormControl-root MuiTextField-root emotion-10"
+                                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                               >
-                                <label
-                                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                                  data-shrink={false}
-                                  htmlFor="root_person_address_city"
-                                  id="root_person_address_city-label"
-                                >
-                                  city
-                                </label>
                                 <div
-                                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                                  onClick={[Function]}
+                                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                  class="MuiFormControl-root MuiTextField-root emotion-10"
                                 >
-                                  <input
-                                    aria-invalid={false}
-                                    autoFocus={false}
-                                    className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                                    disabled={false}
-                                    id="root_person_address_city"
-                                    name="root[person][address][city]"
-                                    onAnimationStart={[Function]}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    required={false}
-                                    type="text"
-                                    value=""
-                                  />
-                                  <fieldset
-                                    aria-hidden={true}
-                                    className="MuiOutlinedInput-notchedOutline emotion-14"
+                                  <label
+                                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                                    data-shrink="false"
+                                    for="root_person_address_city"
+                                    id="root_person_address_city-label"
                                   >
-                                    <legend
-                                      className="emotion-15"
+                                    city
+                                  </label>
+                                  <div
+                                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                                  >
+                                    <input
+                                      aria-invalid="false"
+                                      class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                                      id="root_person_address_city"
+                                      name="root[person][address][city]"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <fieldset
+                                      aria-hidden="true"
+                                      class="MuiOutlinedInput-notchedOutline emotion-14"
                                     >
-                                      <span>
-                                        city
-                                      </span>
-                                    </legend>
-                                  </fieldset>
+                                      <legend
+                                        class="emotion-15"
+                                      >
+                                        <span>
+                                          city
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              class="rjsf-field rjsf-field-string"
                             >
                               <div
-                                aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                className="MuiFormControl-root MuiTextField-root emotion-10"
+                                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                               >
-                                <label
-                                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                                  data-shrink={false}
-                                  htmlFor="root_person_address_country"
-                                  id="root_person_address_country-label"
-                                >
-                                  country
-                                </label>
                                 <div
-                                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                                  onClick={[Function]}
+                                  aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                  class="MuiFormControl-root MuiTextField-root emotion-10"
                                 >
-                                  <input
-                                    aria-invalid={false}
-                                    autoFocus={false}
-                                    className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                                    disabled={false}
-                                    id="root_person_address_country"
-                                    name="root[person][address][country]"
-                                    onAnimationStart={[Function]}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    required={false}
-                                    type="text"
-                                    value=""
-                                  />
-                                  <fieldset
-                                    aria-hidden={true}
-                                    className="MuiOutlinedInput-notchedOutline emotion-14"
+                                  <label
+                                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                                    data-shrink="false"
+                                    for="root_person_address_country"
+                                    id="root_person_address_country-label"
+                                  >
+                                    country
+                                  </label>
+                                  <div
+                                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
                                   >
-                                    <legend
-                                      className="emotion-15"
+                                    <input
+                                      aria-invalid="false"
+                                      class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                                      id="root_person_address_country"
+                                      name="root[person][address][country]"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <fieldset
+                                      aria-hidden="true"
+                                      class="MuiOutlinedInput-notchedOutline emotion-14"
                                     >
-                                      <span>
-                                        country
-                                      </span>
-                                    </legend>
-                                  </fieldset>
+                                      <legend
+                                        class="emotion-15"
+                                      >
+                                        <span>
+                                          country
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
                                 </div>
                               </div>
                             </div>
@@ -813,36 +743,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-46"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-47"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-46"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-47"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -1632,320 +1550,236 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_name__error root_name__description root_name__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                  data-shrink={true}
-                  htmlFor="root_name"
-                  id="root_name-label"
-                >
-                  name
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="John"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_name"
+                    id="root_name-label"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
+                      type="text"
+                      value="John"
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        name
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          name
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-11"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-12"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-13"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                  data-shrink={true}
-                  htmlFor="root_customField-key"
-                  id="root_customField-key-label"
-                >
-                  customField Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-15"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    defaultValue="customField"
-                    disabled={false}
-                    id="root_customField-key"
-                    name="root_customField-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
-                  >
-                    <legend
-                      className="emotion-9"
-                    >
-                      <span>
-                        customField Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-12"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-11"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-12"
               >
                 <div
-                  aria-describedby="root_customField__error root_customField__description root_customField__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-13"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                    data-shrink={true}
-                    htmlFor="root_customField"
-                    id="root_customField-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_customField-key"
+                    id="root_customField-key-label"
                   >
-                    customField
+                    customField Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-15"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                      disabled={false}
-                      id="root_customField"
-                      name="root[customField]"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_customField-key"
+                      name="root_customField-key"
                       type="text"
-                      value="customValue"
+                      value="customField"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
                       <legend
-                        className="emotion-9"
+                        class="emotion-9"
                       >
                         <span>
-                          customField
+                          customField Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-12"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_customField__error root_customField__description root_customField__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-4"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                      data-shrink="true"
+                      for="root_customField"
+                      id="root_customField-label"
+                    >
+                      customField
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                        id="root_customField"
+                        name="root[customField]"
+                        placeholder=""
+                        type="text"
+                        value="customValue"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-8"
+                      >
+                        <legend
+                          class="emotion-9"
+                        >
+                          <span>
+                            customField
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-27"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-28"
+                  id="root_customField__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-29"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-30"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-27"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-27"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-28"
-                disabled={null}
-                id="root_customField__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-32"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-29"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-29"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-30"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-27"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-32"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-29"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-34"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-35"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-34"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-35"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -2045,6 +1879,12 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -2054,6 +1894,16 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-5.Mui-focused {
@@ -2246,6 +2096,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-9>span {
@@ -2929,342 +2782,264 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_name__error root_name__description root_name__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_name"
-                  id="root_name-label"
-                >
-                  name
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="Alice"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_name"
+                    id="root_name-label"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
+                      type="text"
+                      value="Alice"
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        name
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          name
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_age__error root_age__description root_age__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_age"
-                  id="root_age-label"
-                >
-                  age
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={30}
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_age"
+                    id="root_age-label"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="30"
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        age
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          age
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-boolean"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-boolean"
             >
-              <label
-                className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-20"
+              <div
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <span
-                  aria-describedby="root_active__error root_active__description root_active__help"
-                  className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium Mui-checked MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-21"
-                  onBlur={[Function]}
-                  onContextMenu={[Function]}
-                  onDragLeave={[Function]}
-                  onFocus={[Function]}
-                  onKeyDown={[Function]}
-                  onKeyUp={[Function]}
-                  onMouseDown={[Function]}
-                  onMouseLeave={[Function]}
-                  onMouseUp={[Function]}
-                  onTouchEnd={[Function]}
-                  onTouchMove={[Function]}
-                  onTouchStart={[Function]}
-                  tabIndex={null}
+                <label
+                  class="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-20"
                 >
-                  <input
-                    autoFocus={false}
-                    checked={true}
-                    className="PrivateSwitchBase-input emotion-22"
-                    data-indeterminate={false}
-                    disabled={false}
-                    id="root_active"
-                    name="root[active]"
-                    onChange={[Function]}
-                    required={false}
-                    type="checkbox"
-                  />
-                  <svg
-                    aria-hidden={true}
-                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-23"
-                    data-testid="CheckBoxIcon"
-                    focusable="false"
-                    viewBox="0 0 24 24"
+                  <span
+                    aria-describedby="root_active__error root_active__description root_active__help"
+                    class="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium Mui-checked MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-21"
                   >
-                    <path
-                      d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+                    <input
+                      checked=""
+                      class="PrivateSwitchBase-input emotion-22"
+                      data-indeterminate="false"
+                      id="root_active"
+                      name="root[active]"
+                      type="checkbox"
                     />
-                  </svg>
-                </span>
-                <span
-                  className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-24"
-                  style={{}}
-                >
-                  active
-                </span>
-              </label>
+                    <svg
+                      aria-hidden="true"
+                      class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-23"
+                      data-testid="CheckBoxIcon"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    class="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-24"
+                  >
+                    active
+                  </span>
+                </label>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-array"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-array"
             >
               <div
-                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
-                style={
-                  {
-                    "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                  }
-                }
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
                 <div
-                  className="MuiBox-root emotion-28"
+                  class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
+                  style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                 >
                   <div
-                    className="MuiBox-root emotion-29"
-                    id="root_tags__title"
+                    class="MuiBox-root emotion-28"
                   >
-                    <h5
-                      className="MuiTypography-root MuiTypography-h5 emotion-30"
-                      style={{}}
+                    <div
+                      class="MuiBox-root emotion-29"
+                      id="root_tags__title"
                     >
-                      tags
-                    </h5>
-                    <hr
-                      className="MuiDivider-root MuiDivider-fullWidth emotion-31"
-                    />
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-32"
-                  >
+                      <h5
+                        class="MuiTypography-root MuiTypography-h5 emotion-30"
+                      >
+                        tags
+                      </h5>
+                      <hr
+                        class="MuiDivider-root MuiDivider-fullWidth emotion-31"
+                      />
+                    </div>
                     <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-33"
-                      style={
-                        {
-                          "overflow": "auto",
-                        }
-                      }
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-32"
                     >
                       <div
-                        className="MuiBox-root emotion-34"
+                        class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-33"
+                        style="overflow: auto;"
                       >
                         <div
-                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
-                          style={
-                            {
-                              "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                            }
-                          }
+                          class="MuiBox-root emotion-34"
                         >
                           <div
-                            className="MuiBox-root emotion-28"
+                            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
+                            style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                           >
                             <div
-                              className="rjsf-field rjsf-field-string"
+                              class="MuiBox-root emotion-28"
                             >
                               <div
-                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <div
-                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                                 >
-                                  <label
-                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                                    data-shrink={false}
-                                    htmlFor="root_tags_0"
-                                    id="root_tags_0-label"
-                                  >
-                                    tags-0
-                                    <span
-                                      aria-hidden={true}
-                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-40"
-                                    >
-                                       
-                                      *
-                                    </span>
-                                  </label>
                                   <div
-                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                                    onClick={[Function]}
+                                    aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                    class="MuiFormControl-root MuiTextField-root emotion-4"
                                   >
-                                    <input
-                                      aria-invalid={false}
-                                      autoFocus={false}
-                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                                      disabled={false}
-                                      id="root_tags_0"
-                                      name="root[tags][0]"
-                                      onAnimationStart={[Function]}
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      required={true}
-                                      type="text"
-                                      value="developer"
-                                    />
-                                    <fieldset
-                                      aria-hidden={true}
-                                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                                    <label
+                                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                                      data-shrink="true"
+                                      for="root_tags_0"
+                                      id="root_tags_0-label"
                                     >
-                                      <legend
-                                        className="emotion-9"
+                                      tags-0
+                                      <span
+                                        aria-hidden="true"
+                                        class="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-40"
                                       >
-                                        <span>
-                                          tags-0
-                                           
-                                          *
-                                        </span>
-                                      </legend>
-                                    </fieldset>
+                                         *
+                                      </span>
+                                    </label>
+                                    <div
+                                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                                    >
+                                      <input
+                                        aria-invalid="false"
+                                        class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                                        id="root_tags_0"
+                                        name="root[tags][0]"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="developer"
+                                      />
+                                      <fieldset
+                                        aria-hidden="true"
+                                        class="MuiOutlinedInput-notchedOutline emotion-8"
+                                      >
+                                        <legend
+                                          class="emotion-9"
+                                        >
+                                          <span>
+                                            tags-0 *
+                                          </span>
+                                        </legend>
+                                      </fieldset>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -3272,195 +3047,136 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
-                    >
-                      <button
-                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-46"
-                        disabled={true}
-                        id="root_tags_0__moveUp"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={-1}
-                        title="Move up"
-                        type="button"
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="ArrowUpwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                        <button
+                          class="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-46"
+                          disabled=""
+                          id="root_tags_0__moveUp"
+                          tabindex="-1"
+                          title="Move up"
+                          type="button"
                         >
-                          <path
-                            d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-46"
-                        disabled={null}
-                        id="root_tags_0__moveDown"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Move down"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="ArrowDownwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="ArrowUpwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-46"
+                          id="root_tags_0__moveDown"
+                          tabindex="0"
+                          title="Move down"
+                          type="button"
                         >
-                          <path
-                            d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-50"
-                        disabled={null}
-                        id="root_tags_0__remove"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Remove"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="RemoveIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="ArrowDownwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-50"
+                          id="root_tags_0__remove"
+                          tabindex="0"
+                          title="Remove"
+                          type="button"
                         >
-                          <path
-                            d="M19 13H5v-2h14z"
-                          />
-                        </svg>
-                      </button>
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="RemoveIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="M19 13H5v-2h14z"
+                            />
+                          </svg>
+                        </button>
+                      </div>
                     </div>
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-32"
-                  >
                     <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-33"
-                      style={
-                        {
-                          "overflow": "auto",
-                        }
-                      }
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-32"
                     >
                       <div
-                        className="MuiBox-root emotion-34"
+                        class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-33"
+                        style="overflow: auto;"
                       >
                         <div
-                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
-                          style={
-                            {
-                              "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                            }
-                          }
+                          class="MuiBox-root emotion-34"
                         >
                           <div
-                            className="MuiBox-root emotion-28"
+                            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-27"
+                            style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                           >
                             <div
-                              className="rjsf-field rjsf-field-string"
+                              class="MuiBox-root emotion-28"
                             >
                               <div
-                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <div
-                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                                 >
-                                  <label
-                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                                    data-shrink={false}
-                                    htmlFor="root_tags_1"
-                                    id="root_tags_1-label"
-                                  >
-                                    tags-1
-                                    <span
-                                      aria-hidden={true}
-                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-40"
-                                    >
-                                       
-                                      *
-                                    </span>
-                                  </label>
                                   <div
-                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                                    onClick={[Function]}
+                                    aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                    class="MuiFormControl-root MuiTextField-root emotion-4"
                                   >
-                                    <input
-                                      aria-invalid={false}
-                                      autoFocus={false}
-                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                                      disabled={false}
-                                      id="root_tags_1"
-                                      name="root[tags][1]"
-                                      onAnimationStart={[Function]}
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      required={true}
-                                      type="text"
-                                      value="designer"
-                                    />
-                                    <fieldset
-                                      aria-hidden={true}
-                                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                                    <label
+                                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                                      data-shrink="true"
+                                      for="root_tags_1"
+                                      id="root_tags_1-label"
                                     >
-                                      <legend
-                                        className="emotion-9"
+                                      tags-1
+                                      <span
+                                        aria-hidden="true"
+                                        class="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-40"
                                       >
-                                        <span>
-                                          tags-1
-                                           
-                                          *
-                                        </span>
-                                      </legend>
-                                    </fieldset>
+                                         *
+                                      </span>
+                                    </label>
+                                    <div
+                                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                                    >
+                                      <input
+                                        aria-invalid="false"
+                                        class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                                        id="root_tags_1"
+                                        name="root[tags][1]"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="designer"
+                                      />
+                                      <fieldset
+                                        aria-hidden="true"
+                                        class="MuiOutlinedInput-notchedOutline emotion-8"
+                                      >
+                                        <legend
+                                          class="emotion-9"
+                                        >
+                                          <span>
+                                            tags-1 *
+                                          </span>
+                                        </legend>
+                                      </fieldset>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -3468,155 +3184,100 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
-                    >
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-46"
-                        disabled={null}
-                        id="root_tags_1__moveUp"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Move up"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="ArrowUpwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-46"
-                        disabled={true}
-                        id="root_tags_1__moveDown"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={-1}
-                        title="Move down"
-                        type="button"
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="ArrowDownwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-46"
+                          id="root_tags_1__moveUp"
+                          tabindex="0"
+                          title="Move up"
+                          type="button"
                         >
-                          <path
-                            d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-50"
-                        disabled={null}
-                        id="root_tags_1__remove"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Remove"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
-                          data-testid="RemoveIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="ArrowUpwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-46"
+                          disabled=""
+                          id="root_tags_1__moveDown"
+                          tabindex="-1"
+                          title="Move down"
+                          type="button"
                         >
-                          <path
-                            d="M19 13H5v-2h14z"
-                          />
-                        </svg>
-                      </button>
-                    </div>
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-72"
-                  >
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
-                    >
-                      <div
-                        className="MuiBox-root emotion-74"
-                      >
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="ArrowDownwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
+                            />
+                          </svg>
+                        </button>
                         <button
-                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-75"
-                          disabled={null}
-                          id="root_tags__add"
-                          onBlur={[Function]}
-                          onClick={[Function]}
-                          onContextMenu={[Function]}
-                          onDragLeave={[Function]}
-                          onFocus={[Function]}
-                          onKeyDown={[Function]}
-                          onKeyUp={[Function]}
-                          onMouseDown={[Function]}
-                          onMouseLeave={[Function]}
-                          onMouseUp={[Function]}
-                          onTouchEnd={[Function]}
-                          onTouchMove={[Function]}
-                          onTouchStart={[Function]}
-                          tabIndex={0}
-                          title="Add Item"
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-50"
+                          id="root_tags_1__remove"
+                          tabindex="0"
+                          title="Remove"
                           type="button"
                         >
                           <svg
-                            aria-hidden={true}
-                            className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-23"
-                            data-testid="AddIcon"
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-47"
+                            data-testid="RemoveIcon"
                             focusable="false"
                             viewBox="0 0 24 24"
                           >
                             <path
-                              d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                              d="M19 13H5v-2h14z"
                             />
                           </svg>
                         </button>
                       </div>
                     </div>
+                    <div
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-72"
+                    >
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-45"
+                      >
+                        <div
+                          class="MuiBox-root emotion-74"
+                        >
+                          <button
+                            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-75"
+                            id="root_tags__add"
+                            tabindex="0"
+                            title="Add Item"
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-23"
+                              data-testid="AddIcon"
+                              focusable="false"
+                              viewBox="0 0 24 24"
+                            >
+                              <path
+                                d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                              />
+                            </svg>
+                          </button>
+                        </div>
+                      </div>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -3625,36 +3286,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-77"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-78"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-77"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-78"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -4089,209 +3738,168 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_firstName"
-                  id="root_firstName-label"
-                >
-                  firstName
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root[firstName]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_firstName"
+                    id="root_firstName-label"
+                  >
+                    firstName
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_firstName"
+                      name="root[firstName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        firstName
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          firstName
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_lastName"
-                  id="root_lastName-label"
-                >
-                  lastName
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root[lastName]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_lastName"
+                    id="root_lastName-label"
                   >
-                    <legend
-                      className="emotion-9"
+                    lastName
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                  >
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_lastName"
+                      name="root[lastName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        lastName
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          lastName
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_age__error root_age__description root_age__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_age"
-                  id="root_age-label"
-                >
-                  age
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_age"
+                    id="root_age-label"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        age
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          age
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
@@ -4299,36 +3907,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -4788,280 +4384,221 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-object"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                className="MuiBox-root emotion-4"
-                id="root_person__title"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <h5
-                  className="MuiTypography-root MuiTypography-h5 emotion-5"
-                  style={{}}
+                <div
+                  class="MuiBox-root emotion-4"
+                  id="root_person__title"
                 >
-                  person
-                </h5>
-                <hr
-                  className="MuiDivider-root MuiDivider-fullWidth emotion-6"
-                />
-              </div>
-              <div
-                className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-                style={
-                  {
-                    "marginTop": "10px",
-                  }
-                }
-              >
+                  <h5
+                    class="MuiTypography-root MuiTypography-h5 emotion-5"
+                  >
+                    person
+                  </h5>
+                  <hr
+                    class="MuiDivider-root MuiDivider-fullWidth emotion-6"
+                  />
+                </div>
                 <div
-                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
+                  class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                  style="margin-top: 10px;"
                 >
                   <div
-                    className="rjsf-field rjsf-field-string"
+                    class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      class="rjsf-field rjsf-field-string"
                     >
                       <div
-                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                       >
-                        <label
-                          className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                          data-shrink={false}
-                          htmlFor="root_person_name"
-                          id="root_person_name-label"
-                        >
-                          name
-                        </label>
                         <div
-                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                          onClick={[Function]}
+                          aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                          class="MuiFormControl-root MuiTextField-root emotion-10"
                         >
-                          <input
-                            aria-invalid={false}
-                            autoFocus={false}
-                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                            disabled={false}
-                            id="root_person_name"
-                            name="root.person.name"
-                            onAnimationStart={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            required={false}
-                            type="text"
-                            value=""
-                          />
-                          <fieldset
-                            aria-hidden={true}
-                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          <label
+                            class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                            data-shrink="false"
+                            for="root_person_name"
+                            id="root_person_name-label"
+                          >
+                            name
+                          </label>
+                          <div
+                            class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
                           >
-                            <legend
-                              className="emotion-15"
+                            <input
+                              aria-invalid="false"
+                              class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                              id="root_person_name"
+                              name="root.person.name"
+                              placeholder=""
+                              type="text"
+                              value=""
+                            />
+                            <fieldset
+                              aria-hidden="true"
+                              class="MuiOutlinedInput-notchedOutline emotion-14"
                             >
-                              <span>
-                                name
-                              </span>
-                            </legend>
-                          </fieldset>
+                              <legend
+                                class="emotion-15"
+                              >
+                                <span>
+                                  name
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
                         </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                  style={
-                    {
-                      "marginBottom": "10px",
-                    }
-                  }
-                >
                   <div
-                    className="rjsf-field rjsf-field-object"
+                    class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                    style="margin-bottom: 10px;"
                   >
                     <div
-                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      class="rjsf-field rjsf-field-object"
                     >
                       <div
-                        className="MuiBox-root emotion-4"
-                        id="root_person_address__title"
+                        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                       >
-                        <h5
-                          className="MuiTypography-root MuiTypography-h5 emotion-5"
-                          style={{}}
+                        <div
+                          class="MuiBox-root emotion-4"
+                          id="root_person_address__title"
                         >
-                          address
-                        </h5>
-                        <hr
-                          className="MuiDivider-root MuiDivider-fullWidth emotion-6"
-                        />
-                      </div>
-                      <div
-                        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-                        style={
-                          {
-                            "marginTop": "10px",
-                          }
-                        }
-                      >
+                          <h5
+                            class="MuiTypography-root MuiTypography-h5 emotion-5"
+                          >
+                            address
+                          </h5>
+                          <hr
+                            class="MuiDivider-root MuiDivider-fullWidth emotion-6"
+                          />
+                        </div>
                         <div
-                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
+                          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                          style="margin-top: 10px;"
                         >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              class="rjsf-field rjsf-field-string"
                             >
                               <div
-                                aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                className="MuiFormControl-root MuiTextField-root emotion-10"
+                                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                               >
-                                <label
-                                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                                  data-shrink={false}
-                                  htmlFor="root_person_address_street"
-                                  id="root_person_address_street-label"
-                                >
-                                  street
-                                </label>
                                 <div
-                                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                                  onClick={[Function]}
+                                  aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                  class="MuiFormControl-root MuiTextField-root emotion-10"
                                 >
-                                  <input
-                                    aria-invalid={false}
-                                    autoFocus={false}
-                                    className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                                    disabled={false}
-                                    id="root_person_address_street"
-                                    name="root.person.address.street"
-                                    onAnimationStart={[Function]}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    required={false}
-                                    type="text"
-                                    value=""
-                                  />
-                                  <fieldset
-                                    aria-hidden={true}
-                                    className="MuiOutlinedInput-notchedOutline emotion-14"
+                                  <label
+                                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                                    data-shrink="false"
+                                    for="root_person_address_street"
+                                    id="root_person_address_street-label"
                                   >
-                                    <legend
-                                      className="emotion-15"
+                                    street
+                                  </label>
+                                  <div
+                                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                                  >
+                                    <input
+                                      aria-invalid="false"
+                                      class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                                      id="root_person_address_street"
+                                      name="root.person.address.street"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <fieldset
+                                      aria-hidden="true"
+                                      class="MuiOutlinedInput-notchedOutline emotion-14"
                                     >
-                                      <span>
-                                        street
-                                      </span>
-                                    </legend>
-                                  </fieldset>
+                                      <legend
+                                        class="emotion-15"
+                                      >
+                                        <span>
+                                          street
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
                                 </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-                          style={
-                            {
-                              "marginBottom": "10px",
-                            }
-                          }
-                        >
                           <div
-                            className="rjsf-field rjsf-field-string"
+                            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                            style="margin-bottom: 10px;"
                           >
                             <div
-                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              class="rjsf-field rjsf-field-string"
                             >
                               <div
-                                aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                className="MuiFormControl-root MuiTextField-root emotion-10"
+                                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                               >
-                                <label
-                                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
-                                  data-shrink={false}
-                                  htmlFor="root_person_address_city"
-                                  id="root_person_address_city-label"
-                                >
-                                  city
-                                </label>
                                 <div
-                                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
-                                  onClick={[Function]}
+                                  aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                  class="MuiFormControl-root MuiTextField-root emotion-10"
                                 >
-                                  <input
-                                    aria-invalid={false}
-                                    autoFocus={false}
-                                    className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
-                                    disabled={false}
-                                    id="root_person_address_city"
-                                    name="root.person.address.city"
-                                    onAnimationStart={[Function]}
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    required={false}
-                                    type="text"
-                                    value=""
-                                  />
-                                  <fieldset
-                                    aria-hidden={true}
-                                    className="MuiOutlinedInput-notchedOutline emotion-14"
+                                  <label
+                                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-11"
+                                    data-shrink="false"
+                                    for="root_person_address_city"
+                                    id="root_person_address_city-label"
                                   >
-                                    <legend
-                                      className="emotion-15"
+                                    city
+                                  </label>
+                                  <div
+                                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                                  >
+                                    <input
+                                      aria-invalid="false"
+                                      class="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                                      id="root_person_address_city"
+                                      name="root.person.address.city"
+                                      placeholder=""
+                                      type="text"
+                                      value=""
+                                    />
+                                    <fieldset
+                                      aria-hidden="true"
+                                      class="MuiOutlinedInput-notchedOutline emotion-14"
                                     >
-                                      <span>
-                                        city
-                                      </span>
-                                    </legend>
-                                  </fieldset>
+                                      <legend
+                                        class="emotion-15"
+                                      >
+                                        <span>
+                                          city
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
                                 </div>
                               </div>
                             </div>
@@ -5077,36 +4614,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-38"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-39"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-38"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-39"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -5990,274 +5515,218 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_name__error root_name__description root_name__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                  data-shrink={true}
-                  htmlFor="root_name"
-                  id="root_name-label"
-                >
-                  name
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_name"
-                    name="root.name"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value="Test"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_name"
+                    id="root_name-label"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_name"
+                      name="root.name"
+                      placeholder=""
+                      type="text"
+                      value="Test"
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        name
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          name
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_count__error root_count__description root_count__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                  data-shrink={true}
-                  htmlFor="root_count"
-                  id="root_count-label"
-                >
-                  count
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_count__error root_count__description root_count__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_count"
-                    name="root.count"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={5}
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                    data-shrink="true"
+                    for="root_count"
+                    id="root_count-label"
                   >
-                    <legend
-                      className="emotion-9"
+                    count
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                  >
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_count"
+                      name="root.count"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="5"
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        count
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          count
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-array"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-array"
             >
               <div
-                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
-                style={
-                  {
-                    "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                  }
-                }
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
                 <div
-                  className="MuiBox-root emotion-21"
+                  class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
+                  style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                 >
                   <div
-                    className="MuiBox-root emotion-22"
-                    id="root_items__title"
+                    class="MuiBox-root emotion-21"
                   >
-                    <h5
-                      className="MuiTypography-root MuiTypography-h5 emotion-23"
-                      style={{}}
+                    <div
+                      class="MuiBox-root emotion-22"
+                      id="root_items__title"
                     >
-                      items
-                    </h5>
-                    <hr
-                      className="MuiDivider-root MuiDivider-fullWidth emotion-24"
-                    />
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-25"
-                  >
+                      <h5
+                        class="MuiTypography-root MuiTypography-h5 emotion-23"
+                      >
+                        items
+                      </h5>
+                      <hr
+                        class="MuiDivider-root MuiDivider-fullWidth emotion-24"
+                      />
+                    </div>
                     <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-26"
-                      style={
-                        {
-                          "overflow": "auto",
-                        }
-                      }
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-25"
                     >
                       <div
-                        className="MuiBox-root emotion-27"
+                        class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-26"
+                        style="overflow: auto;"
                       >
                         <div
-                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
-                          style={
-                            {
-                              "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                            }
-                          }
+                          class="MuiBox-root emotion-27"
                         >
                           <div
-                            className="MuiBox-root emotion-21"
+                            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
+                            style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                           >
                             <div
-                              className="rjsf-field rjsf-field-string"
+                              class="MuiBox-root emotion-21"
                             >
                               <div
-                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <div
-                                  aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                                 >
-                                  <label
-                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                                    data-shrink={true}
-                                    htmlFor="root_items_0"
-                                    id="root_items_0-label"
-                                  >
-                                    items-0
-                                    <span
-                                      aria-hidden={true}
-                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-33"
-                                    >
-                                       
-                                      *
-                                    </span>
-                                  </label>
                                   <div
-                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                                    onClick={[Function]}
+                                    aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                    class="MuiFormControl-root MuiTextField-root emotion-4"
                                   >
-                                    <input
-                                      aria-invalid={false}
-                                      autoFocus={false}
-                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                                      disabled={false}
-                                      id="root_items_0"
-                                      name="root.items.0"
-                                      onAnimationStart={[Function]}
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      required={true}
-                                      type="text"
-                                      value="a"
-                                    />
-                                    <fieldset
-                                      aria-hidden={true}
-                                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                                    <label
+                                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                                      data-shrink="true"
+                                      for="root_items_0"
+                                      id="root_items_0-label"
                                     >
-                                      <legend
-                                        className="emotion-9"
+                                      items-0
+                                      <span
+                                        aria-hidden="true"
+                                        class="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-33"
                                       >
-                                        <span>
-                                          items-0
-                                           
-                                          *
-                                        </span>
-                                      </legend>
-                                    </fieldset>
+                                         *
+                                      </span>
+                                    </label>
+                                    <div
+                                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                                    >
+                                      <input
+                                        aria-invalid="false"
+                                        class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                                        id="root_items_0"
+                                        name="root.items.0"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="a"
+                                      />
+                                      <fieldset
+                                        aria-hidden="true"
+                                        class="MuiOutlinedInput-notchedOutline emotion-8"
+                                      >
+                                        <legend
+                                          class="emotion-9"
+                                        >
+                                          <span>
+                                            items-0 *
+                                          </span>
+                                        </legend>
+                                      </fieldset>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -6265,195 +5734,136 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
-                    >
-                      <button
-                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-39"
-                        disabled={true}
-                        id="root_items_0__moveUp"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={-1}
-                        title="Move up"
-                        type="button"
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="ArrowUpwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                        <button
+                          class="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-39"
+                          disabled=""
+                          id="root_items_0__moveUp"
+                          tabindex="-1"
+                          title="Move up"
+                          type="button"
                         >
-                          <path
-                            d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-39"
-                        disabled={null}
-                        id="root_items_0__moveDown"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Move down"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="ArrowDownwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="ArrowUpwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-39"
+                          id="root_items_0__moveDown"
+                          tabindex="0"
+                          title="Move down"
+                          type="button"
                         >
-                          <path
-                            d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-43"
-                        disabled={null}
-                        id="root_items_0__remove"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Remove"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="RemoveIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="ArrowDownwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-43"
+                          id="root_items_0__remove"
+                          tabindex="0"
+                          title="Remove"
+                          type="button"
                         >
-                          <path
-                            d="M19 13H5v-2h14z"
-                          />
-                        </svg>
-                      </button>
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="RemoveIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="M19 13H5v-2h14z"
+                            />
+                          </svg>
+                        </button>
+                      </div>
                     </div>
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-25"
-                  >
                     <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-26"
-                      style={
-                        {
-                          "overflow": "auto",
-                        }
-                      }
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-25"
                     >
                       <div
-                        className="MuiBox-root emotion-27"
+                        class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-26"
+                        style="overflow: auto;"
                       >
                         <div
-                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
-                          style={
-                            {
-                              "--Paper-shadow": "0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12)",
-                            }
-                          }
+                          class="MuiBox-root emotion-27"
                         >
                           <div
-                            className="MuiBox-root emotion-21"
+                            class="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-20"
+                            style="--Paper-shadow: 0px 3px 1px -2px rgba(0,0,0,0.2),0px 2px 2px 0px rgba(0,0,0,0.14),0px 1px 5px 0px rgba(0,0,0,0.12);"
                           >
                             <div
-                              className="rjsf-field rjsf-field-string"
+                              class="MuiBox-root emotion-21"
                             >
                               <div
-                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                class="rjsf-field rjsf-field-string"
                               >
                                 <div
-                                  aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
                                 >
-                                  <label
-                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
-                                    data-shrink={true}
-                                    htmlFor="root_items_1"
-                                    id="root_items_1-label"
-                                  >
-                                    items-1
-                                    <span
-                                      aria-hidden={true}
-                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-33"
-                                    >
-                                       
-                                      *
-                                    </span>
-                                  </label>
                                   <div
-                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                                    onClick={[Function]}
+                                    aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                    class="MuiFormControl-root MuiTextField-root emotion-4"
                                   >
-                                    <input
-                                      aria-invalid={false}
-                                      autoFocus={false}
-                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                                      disabled={false}
-                                      id="root_items_1"
-                                      name="root.items.1"
-                                      onAnimationStart={[Function]}
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      required={true}
-                                      type="text"
-                                      value="b"
-                                    />
-                                    <fieldset
-                                      aria-hidden={true}
-                                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                                    <label
+                                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled Mui-required MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-5"
+                                      data-shrink="true"
+                                      for="root_items_1"
+                                      id="root_items_1-label"
                                     >
-                                      <legend
-                                        className="emotion-9"
+                                      items-1
+                                      <span
+                                        aria-hidden="true"
+                                        class="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-33"
                                       >
-                                        <span>
-                                          items-1
-                                           
-                                          *
-                                        </span>
-                                      </legend>
-                                    </fieldset>
+                                         *
+                                      </span>
+                                    </label>
+                                    <div
+                                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                                    >
+                                      <input
+                                        aria-invalid="false"
+                                        class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                                        id="root_items_1"
+                                        name="root.items.1"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="b"
+                                      />
+                                      <fieldset
+                                        aria-hidden="true"
+                                        class="MuiOutlinedInput-notchedOutline emotion-8"
+                                      >
+                                        <legend
+                                          class="emotion-9"
+                                        >
+                                          <span>
+                                            items-1 *
+                                          </span>
+                                        </legend>
+                                      </fieldset>
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -6461,155 +5871,100 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
-                    >
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-39"
-                        disabled={null}
-                        id="root_items_1__moveUp"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Move up"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="ArrowUpwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
-                        >
-                          <path
-                            d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-39"
-                        disabled={true}
-                        id="root_items_1__moveDown"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={-1}
-                        title="Move down"
-                        type="button"
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
                       >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="ArrowDownwardIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                        <button
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-39"
+                          id="root_items_1__moveUp"
+                          tabindex="0"
+                          title="Move up"
+                          type="button"
                         >
-                          <path
-                            d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
-                          />
-                        </svg>
-                      </button>
-                      <button
-                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-43"
-                        disabled={null}
-                        id="root_items_1__remove"
-                        onBlur={[Function]}
-                        onClick={[Function]}
-                        onContextMenu={[Function]}
-                        onDragLeave={[Function]}
-                        onFocus={[Function]}
-                        onKeyDown={[Function]}
-                        onKeyUp={[Function]}
-                        onMouseDown={[Function]}
-                        onMouseLeave={[Function]}
-                        onMouseUp={[Function]}
-                        onTouchEnd={[Function]}
-                        onTouchMove={[Function]}
-                        onTouchStart={[Function]}
-                        tabIndex={0}
-                        title="Remove"
-                        type="button"
-                      >
-                        <svg
-                          aria-hidden={true}
-                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
-                          data-testid="RemoveIcon"
-                          focusable="false"
-                          viewBox="0 0 24 24"
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="ArrowUpwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m4 12 1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8z"
+                            />
+                          </svg>
+                        </button>
+                        <button
+                          class="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-39"
+                          disabled=""
+                          id="root_items_1__moveDown"
+                          tabindex="-1"
+                          title="Move down"
+                          type="button"
                         >
-                          <path
-                            d="M19 13H5v-2h14z"
-                          />
-                        </svg>
-                      </button>
-                    </div>
-                  </div>
-                  <div
-                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-65"
-                  >
-                    <div
-                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
-                    >
-                      <div
-                        className="MuiBox-root emotion-67"
-                      >
+                          <svg
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="ArrowDownwardIcon"
+                            focusable="false"
+                            viewBox="0 0 24 24"
+                          >
+                            <path
+                              d="m20 12-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8z"
+                            />
+                          </svg>
+                        </button>
                         <button
-                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-68"
-                          disabled={null}
-                          id="root_items__add"
-                          onBlur={[Function]}
-                          onClick={[Function]}
-                          onContextMenu={[Function]}
-                          onDragLeave={[Function]}
-                          onFocus={[Function]}
-                          onKeyDown={[Function]}
-                          onKeyUp={[Function]}
-                          onMouseDown={[Function]}
-                          onMouseLeave={[Function]}
-                          onMouseUp={[Function]}
-                          onTouchEnd={[Function]}
-                          onTouchMove={[Function]}
-                          onTouchStart={[Function]}
-                          tabIndex={0}
-                          title="Add Item"
+                          class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-43"
+                          id="root_items_1__remove"
+                          tabindex="0"
+                          title="Remove"
                           type="button"
                         >
                           <svg
-                            aria-hidden={true}
-                            className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-69"
-                            data-testid="AddIcon"
+                            aria-hidden="true"
+                            class="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-40"
+                            data-testid="RemoveIcon"
                             focusable="false"
                             viewBox="0 0 24 24"
                           >
                             <path
-                              d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                              d="M19 13H5v-2h14z"
                             />
                           </svg>
                         </button>
                       </div>
                     </div>
+                    <div
+                      class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-65"
+                    >
+                      <div
+                        class="MuiGrid-root MuiGrid-direction-xs-row emotion-38"
+                      >
+                        <div
+                          class="MuiBox-root emotion-67"
+                        >
+                          <button
+                            class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-68"
+                            id="root_items__add"
+                            tabindex="0"
+                            title="Add Item"
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-69"
+                              data-testid="AddIcon"
+                              focusable="false"
+                              viewBox="0 0 24 24"
+                            >
+                              <path
+                                d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                              />
+                            </svg>
+                          </button>
+                        </div>
+                      </div>
+                    </div>
                   </div>
                 </div>
               </div>
@@ -6618,36 +5973,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-70"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-71"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-70"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-71"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -7082,209 +6425,168 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_firstName"
-                  id="root_firstName-label"
-                >
-                  firstName
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root.firstName"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_firstName"
+                    id="root_firstName-label"
                   >
-                    <legend
-                      className="emotion-9"
+                    firstName
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                  >
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_firstName"
+                      name="root.firstName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        firstName
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          firstName
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_lastName"
-                  id="root_lastName-label"
-                >
-                  lastName
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root.lastName"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_lastName"
+                    id="root_lastName-label"
+                  >
+                    lastName
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_lastName"
+                      name="root.lastName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        lastName
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          lastName
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_age__error root_age__description root_age__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_age"
-                  id="root_age-label"
-                >
-                  age
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_age"
-                    name="root.age"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_age"
+                    id="root_age-label"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_age"
+                      name="root.age"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        age
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          age
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
@@ -7292,36 +6594,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -8111,257 +7401,185 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
-                  data-shrink={true}
-                  htmlFor="root_foo-key"
-                  id="root_foo-key-label"
-                >
-                  foo Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-9"
-                  >
-                    <legend
-                      className="emotion-10"
-                    >
-                      <span>
-                        foo Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
               >
                 <div
-                  aria-describedby="root_foo__error root_foo__description root_foo__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-13"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
-                    data-shrink={true}
-                    htmlFor="root_foo"
-                    id="root_foo-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                    data-shrink="true"
+                    for="root_foo-key"
+                    id="root_foo-key-label"
                   >
-                    foo
+                    foo Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-15"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                      id="root_foo-key"
+                      name="root_foo-key"
                       type="text"
                       value="foo"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-9"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-9"
                     >
                       <legend
-                        className="emotion-10"
+                        class="emotion-10"
                       >
                         <span>
-                          foo
+                          foo Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_foo__error root_foo__description root_foo__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-13"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                      data-shrink="true"
+                      for="root_foo"
+                      id="root_foo-label"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-15"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-9"
+                      >
+                        <legend
+                          class="emotion-10"
+                        >
+                          <span>
+                            foo
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-20"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-22"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-20"
-                disabled={null}
-                id="root_foo__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-24"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-22"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-24"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -8796,146 +8014,117 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_a__error root_a__description root_a__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_a"
-                  id="root_a-label"
-                >
-                  A
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_a"
+                    id="root_a-label"
+                  >
+                    A
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        A
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          A
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_b__error root_b__description root_b__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
-                  data-shrink={false}
-                  htmlFor="root_b"
-                  id="root_b-label"
-                >
-                  B
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
-                  onClick={[Function]}
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-7"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-8"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-5"
+                    data-shrink="false"
+                    for="root_b"
+                    id="root_b-label"
+                  >
+                    B
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
                   >
-                    <legend
-                      className="emotion-9"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-8"
                     >
-                      <span>
-                        B
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-9"
+                      >
+                        <span>
+                          B
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
@@ -8943,36 +8132,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-18"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-19"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-18"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-19"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -9126,6 +8303,12 @@ exports[`object fields show add button and fields if additionalProperties is tru
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -9135,6 +8318,16 @@ exports[`object fields show add button and fields if additionalProperties is tru
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-6.Mui-focused {
@@ -9328,6 +8521,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-10>span {
@@ -9743,257 +8939,185 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-6"
-                  data-shrink={false}
-                  htmlFor="root_additionalProperty-key"
-                  id="root_additionalProperty-key-label"
-                >
-                  additionalProperty Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-9"
-                  >
-                    <legend
-                      className="emotion-10"
-                    >
-                      <span>
-                        additionalProperty Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
               >
                 <div
-                  aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-13"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-6"
-                    data-shrink={false}
-                    htmlFor="root_additionalProperty"
-                    id="root_additionalProperty-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                    data-shrink="true"
+                    for="root_additionalProperty-key"
+                    id="root_additionalProperty-key-label"
                   >
-                    additionalProperty
+                    additionalProperty Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-15"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-9"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-9"
                     >
                       <legend
-                        className="emotion-10"
+                        class="emotion-10"
                       >
                         <span>
-                          additionalProperty
+                          additionalProperty Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-13"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                      data-shrink="true"
+                      for="root_additionalProperty"
+                      id="root_additionalProperty-label"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-15"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-9"
+                      >
+                        <legend
+                          class="emotion-10"
+                        >
+                          <span>
+                            additionalProperty
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-20"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-22"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-20"
-                disabled={null}
-                id="root_additionalProperty__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-24"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
-                  <path
-                    d="M19 13H5v-2h14z"
-                  />
-                </svg>
-              </button>
-            </div>
-          </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-22"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-19"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-24"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-21"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
+                  <path
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -10817,282 +9941,205 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          Test field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a test description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            Test field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a test description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                  data-shrink={true}
-                  htmlFor="root_foo-key"
-                  id="root_foo-key-label"
-                >
-                  foo Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-13"
-                  >
-                    <legend
-                      className="emotion-14"
-                    >
-                      <span>
-                        foo Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
               >
                 <div
-                  aria-describedby="root_foo__error root_foo__description root_foo__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-17"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                    data-shrink={true}
-                    htmlFor="root_foo"
-                    id="root_foo-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                    data-shrink="true"
+                    for="root_foo-key"
+                    id="root_foo-key-label"
                   >
-                    foo
+                    foo Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                      id="root_foo-key"
+                      name="root_foo-key"
                       type="text"
                       value="foo"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-13"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-13"
                     >
                       <legend
-                        className="emotion-14"
+                        class="emotion-14"
                       >
                         <span>
-                          foo
+                          foo Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_foo__error root_foo__description root_foo__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-17"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                      data-shrink="true"
+                      for="root_foo"
+                      id="root_foo-label"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-13"
+                      >
+                        <legend
+                          class="emotion-14"
+                        >
+                          <span>
+                            foo
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
-                disabled={null}
-                id="root_foo__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-30"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-30"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -11916,282 +10963,205 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          My Field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a fancier description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            My Field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a fancier description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                  data-shrink={true}
-                  htmlFor="root_foo-key"
-                  id="root_foo-key-label"
-                >
-                  foo Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-13"
-                  >
-                    <legend
-                      className="emotion-14"
-                    >
-                      <span>
-                        foo Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
               >
                 <div
-                  aria-describedby="root_foo__error root_foo__description root_foo__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-17"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                    data-shrink={true}
-                    htmlFor="root_foo"
-                    id="root_foo-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                    data-shrink="true"
+                    for="root_foo-key"
+                    id="root_foo-key-label"
                   >
-                    foo
+                    foo Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                      id="root_foo-key"
+                      name="root_foo-key"
                       type="text"
                       value="foo"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-13"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-13"
                     >
                       <legend
-                        className="emotion-14"
+                        class="emotion-14"
                       >
                         <span>
-                          foo
+                          foo Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_foo__error root_foo__description root_foo__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-17"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                      data-shrink="true"
+                      for="root_foo"
+                      id="root_foo-label"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-13"
+                      >
+                        <legend
+                          class="emotion-14"
+                        >
+                          <span>
+                            foo
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
-                disabled={null}
-                id="root_foo__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-30"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-30"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -12670,240 +11640,184 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          My Field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a fancier description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            My Field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a fancier description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_a__error root_a__description root_a__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_a"
-                  id="root_a-label"
-                >
-                  My Item A
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_a"
+                    id="root_a-label"
                   >
-                    <legend
-                      className="emotion-13"
+                    My Item A
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                  >
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        My Item A
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          My Item A
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_a__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  a fancier item A description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_a__description"
+                    style="margin-top: 5px;"
+                  >
+                    a fancier item A description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_b__error root_b__description root_b__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_b"
-                  id="root_b-label"
-                >
-                  My Item B
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_b"
+                    id="root_b-label"
+                  >
+                    My Item B
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
                   >
-                    <legend
-                      className="emotion-13"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        My Item B
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          My Item B
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_b__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  a fancier item B description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_b__description"
+                    style="margin-top: 5px;"
+                  >
+                    a fancier item B description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -13727,282 +12641,205 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          My Field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a fancier description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            My Field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a fancier description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                  data-shrink={true}
-                  htmlFor="root_foo-key"
-                  id="root_foo-key-label"
-                >
-                  foo Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-13"
-                  >
-                    <legend
-                      className="emotion-14"
-                    >
-                      <span>
-                        foo Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
               >
                 <div
-                  aria-describedby="root_foo__error root_foo__description root_foo__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-17"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
-                    data-shrink={true}
-                    htmlFor="root_foo"
-                    id="root_foo-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                    data-shrink="true"
+                    for="root_foo-key"
+                    id="root_foo-key-label"
                   >
-                    foo
+                    foo Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                      id="root_foo-key"
+                      name="root_foo-key"
                       type="text"
                       value="foo"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-13"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-13"
                     >
                       <legend
-                        className="emotion-14"
+                        class="emotion-14"
                       >
                         <span>
-                          foo
+                          foo Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_foo__error root_foo__description root_foo__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-17"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                      data-shrink="true"
+                      for="root_foo"
+                      id="root_foo-label"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-13"
+                      >
+                        <legend
+                          class="emotion-14"
+                        >
+                          <span>
+                            foo
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
-                disabled={null}
-                id="root_foo__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-30"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-30"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -14481,240 +13318,184 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          My Field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a fancier description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            My Field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a fancier description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_a__error root_a__description root_a__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_a"
-                  id="root_a-label"
-                >
-                  My Item A
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_a"
+                    id="root_a-label"
+                  >
+                    My Item A
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
                   >
-                    <legend
-                      className="emotion-13"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        My Item A
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          My Item A
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_a__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  a fancier item A description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_a__description"
+                    style="margin-top: 5px;"
+                  >
+                    a fancier item A description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_b__error root_b__description root_b__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_b"
-                  id="root_b-label"
-                >
-                  My Item B
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_b"
+                    id="root_b-label"
                   >
-                    <legend
-                      className="emotion-13"
+                    My Item B
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                  >
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        My Item B
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          My Item B
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_b__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  a fancier item B description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_b__description"
+                    style="margin-top: 5px;"
+                  >
+                    a fancier item B description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -14902,6 +13683,12 @@ exports[`object fields with title and description from uiSchema show add button
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -14911,6 +13698,16 @@ exports[`object fields with title and description from uiSchema show add button
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-10.Mui-focused {
@@ -15104,6 +13901,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-14>span {
@@ -15519,282 +14319,205 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          My Field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a fancier description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            My Field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a fancier description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-10"
-                  data-shrink={false}
-                  htmlFor="root_additionalProperty-key"
-                  id="root_additionalProperty-key-label"
-                >
-                  additionalProperty Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-13"
-                  >
-                    <legend
-                      className="emotion-14"
-                    >
-                      <span>
-                        additionalProperty Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
               >
                 <div
-                  aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-17"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-10"
-                    data-shrink={false}
-                    htmlFor="root_additionalProperty"
-                    id="root_additionalProperty-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                    data-shrink="true"
+                    for="root_additionalProperty-key"
+                    id="root_additionalProperty-key-label"
                   >
-                    additionalProperty
+                    additionalProperty Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-13"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-13"
                     >
                       <legend
-                        className="emotion-14"
+                        class="emotion-14"
                       >
                         <span>
-                          additionalProperty
+                          additionalProperty Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-17"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                      data-shrink="true"
+                      for="root_additionalProperty"
+                      id="root_additionalProperty-label"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-13"
+                      >
+                        <legend
+                          class="emotion-14"
+                        >
+                          <span>
+                            additionalProperty
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
-                disabled={null}
-                id="root_additionalProperty__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-30"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-30"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -16273,240 +14996,184 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          Test field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a test description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            Test field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a test description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_a__error root_a__description root_a__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_a"
-                  id="root_a-label"
-                >
-                  A
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_a"
+                    id="root_a-label"
+                  >
+                    A
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
                   >
-                    <legend
-                      className="emotion-13"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        A
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          A
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_a__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  A description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_a__description"
+                    style="margin-top: 5px;"
+                  >
+                    A description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_b__error root_b__description root_b__help"
-                className="MuiFormControl-root MuiTextField-root emotion-8"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
-                  data-shrink={false}
-                  htmlFor="root_b"
-                  id="root_b-label"
-                >
-                  B
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
-                  onClick={[Function]}
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-8"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-12"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-9"
+                    data-shrink="false"
+                    for="root_b"
+                    id="root_b-label"
+                  >
+                    B
+                  </label>
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
                   >
-                    <legend
-                      className="emotion-13"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-12"
                     >
-                      <span>
-                        B
-                      </span>
-                    </legend>
-                  </fieldset>
+                      <legend
+                        class="emotion-13"
+                      >
+                        <span>
+                          B
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
-              </div>
-              <span
-                className="MuiTypography-root MuiTypography-caption emotion-14"
-                style={{}}
-              >
-                <h6
-                  className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-                  id="root_b__description"
-                  style={
-                    {
-                      "marginTop": "5px",
-                    }
-                  }
+                <span
+                  class="MuiTypography-root MuiTypography-caption emotion-14"
                 >
-                  B description
-                </h6>
-              </span>
+                  <h6
+                    class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+                    id="root_b__description"
+                    style="margin-top: 5px;"
+                  >
+                    B description
+                  </h6>
+                </span>
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-26"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-26"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-27"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -16694,6 +15361,12 @@ exports[`object fields with title and description show add button and fields if
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -16703,6 +15376,16 @@ exports[`object fields with title and description show add button and fields if
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-10.Mui-focused {
@@ -16896,6 +15579,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-14>span {
@@ -17311,282 +15997,205 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-12:focus::-ms-input-
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiBox-root emotion-1"
-        id="root__title"
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
-        <h5
-          className="MuiTypography-root MuiTypography-h5 emotion-2"
-          style={{}}
+        <div
+          class="MuiBox-root emotion-1"
+          id="root__title"
         >
-          Test field
-        </h5>
-        <hr
-          className="MuiDivider-root MuiDivider-fullWidth emotion-3"
-        />
-      </div>
-      <h6
-        className="MuiTypography-root MuiTypography-subtitle2 emotion-4"
-        id="root__description"
-        style={
-          {
-            "marginTop": "5px",
-          }
-        }
-      >
-        a test description
-      </h6>
-      <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
-      >
+          <h5
+            class="MuiTypography-root MuiTypography-h5 emotion-2"
+          >
+            Test field
+          </h5>
+          <hr
+            class="MuiDivider-root MuiDivider-fullWidth emotion-3"
+          />
+        </div>
+        <h6
+          class="MuiTypography-root MuiTypography-subtitle2 emotion-4"
+          id="root__description"
+          style="margin-top: 5px;"
+        >
+          a test description
+        </h6>
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-5"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-6"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
-              >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-10"
-                  data-shrink={false}
-                  htmlFor="root_additionalProperty-key"
-                  id="root_additionalProperty-key-label"
-                >
-                  additionalProperty Key
-                </label>
-                <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
-                  onClick={[Function]}
-                >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-13"
-                  >
-                    <legend
-                      className="emotion-14"
-                    >
-                      <span>
-                        additionalProperty Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-7"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
               >
                 <div
-                  aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-17"
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-9"
                 >
                   <label
-                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-10"
-                    data-shrink={false}
-                    htmlFor="root_additionalProperty"
-                    id="root_additionalProperty-label"
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                    data-shrink="true"
+                    for="root_additionalProperty-key"
+                    id="root_additionalProperty-key-label"
                   >
-                    additionalProperty
+                    additionalProperty Key
                   </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-11"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-12"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-13"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-13"
                     >
                       <legend
-                        className="emotion-14"
+                        class="emotion-14"
                       >
                         <span>
-                          additionalProperty
+                          additionalProperty Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-8"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-17"
+                  >
+                    <label
+                      class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-10"
+                      data-shrink="true"
+                      for="root_additionalProperty"
+                      id="root_additionalProperty-label"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-19"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-12"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-13"
+                      >
+                        <legend
+                          class="emotion-14"
+                        >
+                          <span>
+                            additionalProperty
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-24"
-                disabled={null}
-                id="root_additionalProperty__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-26"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-23"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-28"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-25"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-30"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-30"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-31"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -17740,6 +16349,12 @@ exports[`object fields with title and description with global label off addition
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -17749,6 +16364,16 @@ exports[`object fields with title and description with global label off addition
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-6.Mui-focused {
@@ -17942,6 +16567,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-10>span {
@@ -18367,252 +16995,180 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-6"
-                  data-shrink={false}
-                  htmlFor="root_foo-key"
-                  id="root_foo-key-label"
-                >
-                  foo Key
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
-                  onClick={[Function]}
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-9"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                    data-shrink="true"
+                    for="root_foo-key"
+                    id="root_foo-key-label"
                   >
-                    <legend
-                      className="emotion-10"
-                    >
-                      <span>
-                        foo Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
-              >
-                <div
-                  aria-describedby="root_foo__error root_foo__description root_foo__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-13"
-                >
+                    foo Key
+                  </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                      id="root_foo-key"
+                      name="root_foo-key"
                       type="text"
                       value="foo"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-9"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-9"
                     >
                       <legend
-                        className="emotion-17"
+                        class="emotion-10"
                       >
-                        <span
-                          aria-hidden={true}
-                          className="notranslate"
-                        >
-                          ​
+                        <span>
+                          foo Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_foo__error root_foo__description root_foo__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-13"
+                  >
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-9"
+                      >
+                        <legend
+                          class="emotion-17"
+                        >
+                          <span
+                            aria-hidden="true"
+                            class="notranslate"
+                          >
+                            ​
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-19"
+                  id="root_foo__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-21"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-19"
-                disabled={null}
-                id="root_foo__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-23"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-21"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-23"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-25"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-26"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-25"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-26"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -18989,136 +17545,107 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-6:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="rjsf-field rjsf-field-string"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                aria-describedby="root_a__error root_a__description root_a__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-5"
-                  onClick={[Function]}
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-6"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-7"
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-5"
                   >
-                    <legend
-                      className="emotion-8"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-6"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-7"
                     >
-                      <span
-                        aria-hidden={true}
-                        className="notranslate"
+                      <legend
+                        class="emotion-8"
                       >
-                        ​
-                      </span>
-                    </legend>
-                  </fieldset>
+                        <span
+                          aria-hidden="true"
+                          class="notranslate"
+                        >
+                          ​
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="rjsf-field rjsf-field-number"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              class="rjsf-field rjsf-field-number"
             >
               <div
-                aria-describedby="root_b__error root_b__description root_b__help"
-                className="MuiFormControl-root MuiTextField-root emotion-4"
+                class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
               >
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-5"
-                  onClick={[Function]}
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  class="MuiFormControl-root MuiTextField-root emotion-4"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-6"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-7"
+                  <div
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-5"
                   >
-                    <legend
-                      className="emotion-8"
+                    <input
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-6"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                    <fieldset
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-7"
                     >
-                      <span
-                        aria-hidden={true}
-                        className="notranslate"
+                      <legend
+                        class="emotion-8"
                       >
-                        ​
-                      </span>
-                    </legend>
-                  </fieldset>
+                        <span
+                          aria-hidden="true"
+                          class="notranslate"
+                        >
+                          ​
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
                 </div>
               </div>
             </div>
@@ -19126,36 +17653,24 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-6:focus::-ms-input-p
         </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-16"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-17"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-16"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-17"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-.emotion-0 {
+<DocumentFragment>
+  .emotion-0 {
   display: -webkit-inline-box;
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
@@ -19309,6 +17824,12 @@ exports[`object fields with title and description with global label off show add
   -moz-transform: translate(0, 20px) scale(1);
   -ms-transform: translate(0, 20px) scale(1);
   transform: translate(0, 20px) scale(1);
+  -webkit-transform: translate(0, -1.5px) scale(0.75);
+  -moz-transform: translate(0, -1.5px) scale(0.75);
+  -ms-transform: translate(0, -1.5px) scale(0.75);
+  transform: translate(0, -1.5px) scale(0.75);
+  transform-origin: top left;
+  max-width: 133%;
   -webkit-transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,-webkit-transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: color 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,transform 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms,max-width 200ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   z-index: 1;
@@ -19318,6 +17839,16 @@ exports[`object fields with title and description with global label off show add
   -ms-transform: translate(14px, 16px) scale(1);
   transform: translate(14px, 16px) scale(1);
   max-width: calc(100% - 24px);
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  pointer-events: auto;
+  max-width: calc(133% - 32px);
+  -webkit-transform: translate(14px, -9px) scale(0.75);
+  -moz-transform: translate(14px, -9px) scale(0.75);
+  -ms-transform: translate(14px, -9px) scale(0.75);
+  transform: translate(14px, -9px) scale(0.75);
 }
 
 .emotion-6.Mui-focused {
@@ -19511,6 +18042,9 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
   -webkit-transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   transition: max-width 50ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
   white-space: nowrap;
+  max-width: 100%;
+  -webkit-transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
+  transition: max-width 100ms cubic-bezier(0.0, 0, 0.2, 1) 50ms;
 }
 
 .emotion-10>span {
@@ -19936,246 +18470,173 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-8:focus::-ms-input-p
 }
 
 <form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+    class="rjsf"
   >
     <div
-      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
-        style={
-          {
-            "marginTop": "10px",
-          }
-        }
+        class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
       >
         <div
-          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+          style="margin-top: 10px;"
         >
           <div
-            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
+            class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+            style="margin-bottom: 10px;"
           >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 rjsf-field rjsf-field-string emotion-3"
             >
               <div
-                className="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
               >
-                <label
-                  className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-6"
-                  data-shrink={false}
-                  htmlFor="root_additionalProperty-key"
-                  id="root_additionalProperty-key-label"
-                >
-                  additionalProperty Key
-                </label>
                 <div
-                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
-                  onClick={[Function]}
+                  class="MuiFormControl-root MuiFormControl-fullWidth MuiTextField-root emotion-5"
                 >
-                  <input
-                    aria-invalid={false}
-                    autoFocus={false}
-                    className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onAnimationStart={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                  <fieldset
-                    aria-hidden={true}
-                    className="MuiOutlinedInput-notchedOutline emotion-9"
+                  <label
+                    class="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiFormLabel-filled MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-shrink MuiInputLabel-outlined emotion-6"
+                    data-shrink="true"
+                    for="root_additionalProperty-key"
+                    id="root_additionalProperty-key-label"
                   >
-                    <legend
-                      className="emotion-10"
-                    >
-                      <span>
-                        additionalProperty Key
-                      </span>
-                    </legend>
-                  </fieldset>
-                </div>
-              </div>
-            </div>
-            <div
-              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
-            >
-              <div
-                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
-              >
-                <div
-                  aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                  className="MuiFormControl-root MuiTextField-root emotion-13"
-                >
+                    additionalProperty Key
+                  </label>
                   <div
-                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
-                    onClick={[Function]}
+                    class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-fullWidth MuiInputBase-formControl emotion-7"
                   >
                     <input
-                      aria-invalid={false}
-                      autoFocus={false}
-                      className="MuiInputBase-input MuiOutlinedInput-input emotion-8"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onAnimationStart={[Function]}
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
+                      aria-invalid="false"
+                      class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
                       type="text"
-                      value="should appear"
+                      value="additionalProperty"
                     />
                     <fieldset
-                      aria-hidden={true}
-                      className="MuiOutlinedInput-notchedOutline emotion-9"
+                      aria-hidden="true"
+                      class="MuiOutlinedInput-notchedOutline emotion-9"
                     >
                       <legend
-                        className="emotion-17"
+                        class="emotion-10"
                       >
-                        <span
-                          aria-hidden={true}
-                          className="notranslate"
-                        >
-                          ​
+                        <span>
+                          additionalProperty Key
                         </span>
                       </legend>
                     </fieldset>
                   </div>
                 </div>
               </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              >
+                <div
+                  class="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                >
+                  <div
+                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                    class="MuiFormControl-root MuiTextField-root emotion-13"
+                  >
+                    <div
+                      class="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                    >
+                      <input
+                        aria-invalid="false"
+                        class="MuiInputBase-input MuiOutlinedInput-input emotion-8"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                      <fieldset
+                        aria-hidden="true"
+                        class="MuiOutlinedInput-notchedOutline emotion-9"
+                      >
+                        <legend
+                          class="emotion-17"
+                        >
+                          <span
+                            aria-hidden="true"
+                            class="notranslate"
+                          >
+                            ​
+                          </span>
+                        </legend>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
+              >
+                <button
+                  class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-19"
+                  id="root_additionalProperty__remove"
+                  style="flex: 1 1 0%; padding-left: 6px; padding-right: 6px; font-weight: bold;"
+                  tabindex="0"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
+                    data-testid="RemoveIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 13H5v-2h14z"
+                    />
+                  </svg>
+                </button>
+              </div>
             </div>
+          </div>
+          <div
+            class="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-21"
+          >
             <div
-              className="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
+              class="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
             >
               <button
-                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorError MuiIconButton-sizeSmall rjsf-object-property-remove emotion-19"
-                disabled={null}
-                id="root_additionalProperty__remove"
-                onBlur={[Function]}
-                onClick={[Function]}
-                onContextMenu={[Function]}
-                onDragLeave={[Function]}
-                onFocus={[Function]}
-                onKeyDown={[Function]}
-                onKeyUp={[Function]}
-                onMouseDown={[Function]}
-                onMouseLeave={[Function]}
-                onMouseUp={[Function]}
-                onTouchEnd={[Function]}
-                onTouchMove={[Function]}
-                onTouchStart={[Function]}
-                style={
-                  {
-                    "flex": 1,
-                    "fontWeight": "bold",
-                    "paddingLeft": 6,
-                    "paddingRight": 6,
-                  }
-                }
-                tabIndex={0}
-                title="Remove"
+                class="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-23"
+                id="root__add"
+                tabindex="0"
+                title="Add Item"
                 type="button"
               >
                 <svg
-                  aria-hidden={true}
-                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
-                  data-testid="RemoveIcon"
+                  aria-hidden="true"
+                  class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
+                  data-testid="AddIcon"
                   focusable="false"
                   viewBox="0 0 24 24"
                 >
                   <path
-                    d="M19 13H5v-2h14z"
+                    d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
                   />
                 </svg>
               </button>
             </div>
           </div>
         </div>
-        <div
-          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-21"
-        >
-          <div
-            className="MuiGrid-root MuiGrid-direction-xs-row emotion-18"
-          >
-            <button
-              className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-object-property-expand emotion-23"
-              disabled={null}
-              id="root__add"
-              onBlur={[Function]}
-              onClick={[Function]}
-              onContextMenu={[Function]}
-              onDragLeave={[Function]}
-              onFocus={[Function]}
-              onKeyDown={[Function]}
-              onKeyUp={[Function]}
-              onMouseDown={[Function]}
-              onMouseLeave={[Function]}
-              onMouseUp={[Function]}
-              onTouchEnd={[Function]}
-              onTouchMove={[Function]}
-              onTouchStart={[Function]}
-              tabIndex={0}
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                aria-hidden={true}
-                className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-20"
-                data-testid="AddIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
-              >
-                <path
-                  d="M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6z"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div
-    className="MuiBox-root emotion-25"
-  >
-    <button
-      className="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-26"
-      disabled={null}
-      onBlur={[Function]}
-      onContextMenu={[Function]}
-      onDragLeave={[Function]}
-      onFocus={[Function]}
-      onKeyDown={[Function]}
-      onKeyUp={[Function]}
-      onMouseDown={[Function]}
-      onMouseLeave={[Function]}
-      onMouseUp={[Function]}
-      onTouchEnd={[Function]}
-      onTouchMove={[Function]}
-      onTouchStart={[Function]}
-      tabIndex={0}
-      type="submit"
+    <div
+      class="MuiBox-root emotion-25"
     >
-      Submit
-    </button>
-  </div>
-</form>
+      <button
+        class="MuiButtonBase-root MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-contained MuiButton-containedPrimary MuiButton-sizeMedium MuiButton-containedSizeMedium MuiButton-colorPrimary emotion-26"
+        tabindex="0"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/primereact/test/__snapshots__/Object.test.tsx.snap b/packages/primereact/test/__snapshots__/Object.test.tsx.snap
index 7c19556746..cdbcb968f9 100644
--- a/packages/primereact/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/primereact/test/__snapshots__/Object.test.tsx.snap
@@ -1,284 +1,167 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-object"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-object"
         >
           <div
-            id="root_person__title"
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            <h5
-              style={
-                {
-                  "fontSize": "1.2rem",
-                  "margin": 0,
-                }
-              }
-            >
-              person
-               
-            </h5>
             <div
-              aria-orientation="horizontal"
-              className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-              data-pc-name="divider"
-              data-pc-section="root"
-              role="separator"
-              style={
-                {
-                  "alignItems": null,
-                  "justifyContent": "center",
-                  "marginTop": "0.5rem",
-                }
-              }
+              id="root_person__title"
             >
+              <h5
+                style="margin: 0px; font-size: 1.2rem;"
+              >
+                person 
+              </h5>
               <div
-                className="p-divider-content"
-                data-pc-section="content"
-              />
+                aria-orientation="horizontal"
+                class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+                data-pc-name="divider"
+                data-pc-section="root"
+                role="separator"
+                style="justify-content: center; margin-top: 0.5rem;"
+              >
+                <div
+                  class="p-divider-content"
+                  data-pc-section="content"
+                />
+              </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-string"
-          >
             <div
-              style={
-                {
-                  "display": "flex",
-                  "flexDirection": "column",
-                  "gap": "0.5rem",
-                  "marginBottom": "1rem",
-                }
-              }
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                htmlFor="root_person_name"
+              <div
+                style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
               >
-                name
-                 
-              </label>
-              <input
-                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                autoFocus={false}
-                className="p-inputtext p-component"
-                data-pc-name="inputtext"
-                data-pc-section="root"
-                disabled={false}
-                id="root_person_name"
-                name="root[person][name]"
-                onBeforeInput={[Function]}
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                onInput={[Function]}
-                onKeyDown={[Function]}
-                onPaste={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+                <label
+                  for="root_person_name"
+                >
+                  name 
+                </label>
+                <input
+                  aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                  class="p-inputtext p-component"
+                  data-pc-name="inputtext"
+                  data-pc-section="root"
+                  id="root_person_name"
+                  name="root[person][name]"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-object"
-          >
             <div
-              style={
-                {
-                  "display": "flex",
-                  "flexDirection": "column",
-                  "gap": "0.5rem",
-                  "marginBottom": "1rem",
-                }
-              }
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                id="root_person_address__title"
+                style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
               >
-                <h5
-                  style={
-                    {
-                      "fontSize": "1.2rem",
-                      "margin": 0,
-                    }
-                  }
-                >
-                  address
-                   
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-                  data-pc-name="divider"
-                  data-pc-section="root"
-                  role="separator"
-                  style={
-                    {
-                      "alignItems": null,
-                      "justifyContent": "center",
-                      "marginTop": "0.5rem",
-                    }
-                  }
+                  id="root_person_address__title"
                 >
+                  <h5
+                    style="margin: 0px; font-size: 1.2rem;"
+                  >
+                    address 
+                  </h5>
                   <div
-                    className="p-divider-content"
-                    data-pc-section="content"
-                  />
+                    aria-orientation="horizontal"
+                    class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+                    data-pc-name="divider"
+                    data-pc-section="root"
+                    role="separator"
+                    style="justify-content: center; margin-top: 0.5rem;"
+                  >
+                    <div
+                      class="p-divider-content"
+                      data-pc-section="content"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  style={
-                    {
-                      "display": "flex",
-                      "flexDirection": "column",
-                      "gap": "0.5rem",
-                      "marginBottom": "1rem",
-                    }
-                  }
+                  class="rjsf-field rjsf-field-string"
                 >
-                  <label
-                    htmlFor="root_person_address_street"
+                  <div
+                    style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                   >
-                    street
-                     
-                  </label>
-                  <input
-                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                    autoFocus={false}
-                    className="p-inputtext p-component"
-                    data-pc-name="inputtext"
-                    data-pc-section="root"
-                    disabled={false}
-                    id="root_person_address_street"
-                    name="root[person][address][street]"
-                    onBeforeInput={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                    <label
+                      for="root_person_address_street"
+                    >
+                      street 
+                    </label>
+                    <input
+                      aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                      class="p-inputtext p-component"
+                      data-pc-name="inputtext"
+                      data-pc-section="root"
+                      id="root_person_address_street"
+                      name="root[person][address][street]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  style={
-                    {
-                      "display": "flex",
-                      "flexDirection": "column",
-                      "gap": "0.5rem",
-                      "marginBottom": "1rem",
-                    }
-                  }
+                  class="rjsf-field rjsf-field-string"
                 >
-                  <label
-                    htmlFor="root_person_address_city"
+                  <div
+                    style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                   >
-                    city
-                     
-                  </label>
-                  <input
-                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                    autoFocus={false}
-                    className="p-inputtext p-component"
-                    data-pc-name="inputtext"
-                    data-pc-section="root"
-                    disabled={false}
-                    id="root_person_address_city"
-                    name="root[person][address][city]"
-                    onBeforeInput={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                    <label
+                      for="root_person_address_city"
+                    >
+                      city 
+                    </label>
+                    <input
+                      aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                      class="p-inputtext p-component"
+                      data-pc-name="inputtext"
+                      data-pc-section="root"
+                      id="root_person_address_city"
+                      name="root[person][address][city]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  style={
-                    {
-                      "display": "flex",
-                      "flexDirection": "column",
-                      "gap": "0.5rem",
-                      "marginBottom": "1rem",
-                    }
-                  }
+                  class="rjsf-field rjsf-field-string"
                 >
-                  <label
-                    htmlFor="root_person_address_country"
+                  <div
+                    style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                   >
-                    country
-                     
-                  </label>
-                  <input
-                    aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                    autoFocus={false}
-                    className="p-inputtext p-component"
-                    data-pc-name="inputtext"
-                    data-pc-section="root"
-                    disabled={false}
-                    id="root_person_address_country"
-                    name="root[person][address][country]"
-                    onBeforeInput={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                    <label
+                      for="root_person_address_country"
+                    >
+                      country 
+                    </label>
+                    <input
+                      aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                      class="p-inputtext p-component"
+                      data-pc-name="inputtext"
+                      data-pc-section="root"
+                      id="root_person_address_country"
+                      name="root[person][address][country]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -286,1234 +169,793 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_name"
-          >
-            name
-             
-          </label>
-          <input
-            aria-describedby="root_name__error root_name__description root_name__help"
-            autoFocus={false}
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_name"
-            name="root[name]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value="John"
-          />
-        </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
-        <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
-        >
-          <label
-            htmlFor="root_customField-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            customField Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="customField"
-            disabled={false}
-            id="root_customField-key"
-            name="root_customField-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            <label
+              for="root_name"
+            >
+              name 
+            </label>
+            <input
+              aria-describedby="root_name__error root_name__description root_name__help"
+              class="p-inputtext p-component p-filled"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_name"
+              name="root[name]"
+              placeholder=""
+              type="text"
+              value="John"
+            />
+          </div>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_customField"
+              for="root_customField-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              customField
-               
+              customField Key
             </label>
             <input
-              aria-describedby="root_customField__error root_customField__description root_customField__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_customField"
-              name="root[customField]"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="customValue"
+              id="root_customField-key"
+              name="root_customField-key"
+              style="width: 100%;"
+              value="customField"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_customField"
+              >
+                customField 
+              </label>
+              <input
+                aria-describedby="root_customField__error root_customField__description root_customField__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_customField"
+                name="root[customField]"
+                placeholder=""
+                type="text"
+                value="customValue"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_customField__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_customField__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_name"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            name
-             
-          </label>
-          <input
-            aria-describedby="root_name__error root_name__description root_name__help"
-            autoFocus={false}
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_name"
-            name="root[name]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value="Alice"
-          />
+            <label
+              for="root_name"
+            >
+              name 
+            </label>
+            <input
+              aria-describedby="root_name__error root_name__description root_name__help"
+              class="p-inputtext p-component p-filled"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_name"
+              name="root[name]"
+              placeholder=""
+              type="text"
+              value="Alice"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_age"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            age
-             
-          </label>
-          <input
-            aria-describedby="root_age__error root_age__description root_age__help"
-            autoFocus={false}
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_age"
-            name="root[age]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value={30}
-          />
+            <label
+              for="root_age"
+            >
+              age 
+            </label>
+            <input
+              aria-describedby="root_age__error root_age__description root_age__help"
+              class="p-inputtext p-component p-filled"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_age"
+              name="root[age]"
+              placeholder=""
+              step="any"
+              type="number"
+              value="30"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-boolean"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-boolean"
         >
           <div
-            style={
-              {
-                "alignItems": "center",
-                "display": "flex",
-                "flexDirection": "row",
-                "gap": "0.5rem",
-              }
-            }
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
             <div
-              aria-describedby="root_active__error root_active__description root_active__help"
-              className="p-checkbox p-component p-highlight"
-              data-p-disabled={false}
-              data-p-highlight={true}
-              data-pc-name="checkbox"
-              data-pc-section="root"
-              id={null}
-              onBlur={[Function]}
-              onContextMenu={null}
-              onFocus={[Function]}
-              onMouseDown={null}
-              style={{}}
+              style="display: flex; flex-direction: row; gap: 0.5rem; align-items: center;"
             >
-              <input
-                aria-describedby="root_active__error root_active__description root_active__help"
-                aria-invalid={false}
-                checked={true}
-                className="p-checkbox-input"
-                data-pc-section="input"
-                disabled={false}
-                id="root_active"
-                name="root[active]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                readOnly={false}
-                required={false}
-                tabIndex={null}
-                type="checkbox"
-              />
               <div
-                className="p-checkbox-box"
-                data-p-disabled={false}
-                data-p-highlight={true}
-                data-pc-section="box"
+                aria-describedby="root_active__error root_active__description root_active__help"
+                class="p-checkbox p-component p-highlight"
+                data-p-disabled="false"
+                data-p-highlight="true"
+                data-pc-name="checkbox"
+                data-pc-section="root"
               >
-                <svg
-                  className="p-icon p-checkbox-icon"
-                  data-pc-section="icon"
-                  fill="none"
-                  height="14"
-                  viewBox="0 0 14 14"
-                  width="14"
-                  xmlns="http://www.w3.org/2000/svg"
+                <input
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  aria-invalid="false"
+                  checked=""
+                  class="p-checkbox-input"
+                  data-pc-section="input"
+                  id="root_active"
+                  name="root[active]"
+                  type="checkbox"
+                />
+                <div
+                  class="p-checkbox-box"
+                  data-p-disabled="false"
+                  data-p-highlight="true"
+                  data-pc-section="box"
                 >
-                  <path
-                    d="M4.86199 11.5948C4.78717 11.5923 4.71366 11.5745 4.64596 11.5426C4.57826 11.5107 4.51779 11.4652 4.46827 11.4091L0.753985 7.69483C0.683167 7.64891 0.623706 7.58751 0.580092 7.51525C0.536478 7.44299 0.509851 7.36177 0.502221 7.27771C0.49459 7.19366 0.506156 7.10897 0.536046 7.03004C0.565935 6.95111 0.613367 6.88 0.674759 6.82208C0.736151 6.76416 0.8099 6.72095 0.890436 6.69571C0.970973 6.67046 1.05619 6.66385 1.13966 6.67635C1.22313 6.68886 1.30266 6.72017 1.37226 6.76792C1.44186 6.81567 1.4997 6.8786 1.54141 6.95197L4.86199 10.2503L12.6397 2.49483C12.7444 2.42694 12.8689 2.39617 12.9932 2.40745C13.1174 2.41873 13.2343 2.47141 13.3251 2.55705C13.4159 2.64268 13.4753 2.75632 13.4938 2.87973C13.5123 3.00315 13.4888 3.1292 13.4271 3.23768L5.2557 11.4091C5.20618 11.4652 5.14571 11.5107 5.07801 11.5426C5.01031 11.5745 4.9368 11.5923 4.86199 11.5948Z"
-                    fill="currentColor"
-                  />
-                </svg>
+                  <svg
+                    class="p-icon p-checkbox-icon"
+                    data-pc-section="icon"
+                    fill="none"
+                    height="14"
+                    viewBox="0 0 14 14"
+                    width="14"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M4.86199 11.5948C4.78717 11.5923 4.71366 11.5745 4.64596 11.5426C4.57826 11.5107 4.51779 11.4652 4.46827 11.4091L0.753985 7.69483C0.683167 7.64891 0.623706 7.58751 0.580092 7.51525C0.536478 7.44299 0.509851 7.36177 0.502221 7.27771C0.49459 7.19366 0.506156 7.10897 0.536046 7.03004C0.565935 6.95111 0.613367 6.88 0.674759 6.82208C0.736151 6.76416 0.8099 6.72095 0.890436 6.69571C0.970973 6.67046 1.05619 6.66385 1.13966 6.67635C1.22313 6.68886 1.30266 6.72017 1.37226 6.76792C1.44186 6.81567 1.4997 6.8786 1.54141 6.95197L4.86199 10.2503L12.6397 2.49483C12.7444 2.42694 12.8689 2.39617 12.9932 2.40745C13.1174 2.41873 13.2343 2.47141 13.3251 2.55705C13.4159 2.64268 13.4753 2.75632 13.4938 2.87973C13.5123 3.00315 13.4888 3.1292 13.4271 3.23768L5.2557 11.4091C5.20618 11.4652 5.14571 11.5107 5.07801 11.5426C5.01031 11.5745 4.9368 11.5923 4.86199 11.5948Z"
+                      fill="currentColor"
+                    />
+                  </svg>
+                </div>
               </div>
+              <label
+                for="root_active"
+              >
+                active 
+              </label>
             </div>
-            <label
-              htmlFor="root_active"
-            >
-              active
-               
-            </label>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-array"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-array"
         >
-          <h5
-            id="root_tags__title"
-            style={
-              {
-                "fontSize": "1.5rem",
-                "margin": 0,
-                "marginBottom": "0.2rem",
-              }
-            }
-          >
-            tags
-             
-          </h5>
-          <fieldset
-            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields p-fieldset p-component"
-            data-pc-name="fieldset"
-            data-pc-section="root"
-            formData={
-              [
-                "developer",
-                "designer",
-              ]
-            }
-            id="root_tags"
-            onClick={null}
-            style={{}}
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            <div
-              aria-labelledby="root_tags_header"
-              className="p-toggleable-content"
-              data-pc-section="toggleablecontent"
-              id="root_tags_content"
-              role="region"
+            <h5
+              id="root_tags__title"
+              style="margin: 0px 0px 0.2rem 0px; font-size: 1.5rem;"
+            >
+              tags 
+            </h5>
+            <fieldset
+              class="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields p-fieldset p-component"
+              data-pc-name="fieldset"
+              data-pc-section="root"
+              formdata="developer,designer"
+              id="root_tags"
             >
               <div
-                className="p-fieldset-content"
-                data-pc-section="content"
+                aria-labelledby="root_tags_header"
+                class="p-toggleable-content"
+                data-pc-section="toggleablecontent"
+                id="root_tags_content"
+                role="region"
               >
-                <div>
+                <div
+                  class="p-fieldset-content"
+                  data-pc-section="content"
+                >
                   <div>
-                    <div
-                      style={
-                        {
-                          "position": "relative",
-                        }
-                      }
-                    >
+                    <div>
                       <div
-                        style={
-                          {
-                            "position": "absolute",
-                            "right": 0,
-                            "top": "-10px",
-                          }
-                        }
+                        style="position: relative;"
                       >
                         <div
-                          style={
-                            {
-                              "flexDirection": "row",
-                            }
-                          }
+                          style="position: absolute; right: 0px; top: -10px;"
                         >
-                          <button
-                            className="rjsf-array-item-move-up p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={true}
-                            id="root_tags_0__moveUp"
-                            onClick={[Function]}
-                            title="Move up"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-up"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-move-down p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_0__moveDown"
-                            onClick={[Function]}
-                            title="Move down"
+                          <div
+                            style="flex-direction: row;"
                           >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-down"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_0__remove"
-                            onClick={[Function]}
-                            title="Remove"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-trash"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
+                            <button
+                              class="rjsf-array-item-move-up p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              disabled=""
+                              id="root_tags_0__moveUp"
+                              title="Move up"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-up"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-move-down p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_tags_0__moveDown"
+                              title="Move down"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-down"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_tags_0__remove"
+                              title="Remove"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-trash"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                          </div>
                         </div>
-                      </div>
-                      <div
-                        className="rjsf-field rjsf-field-string"
-                      >
                         <div
-                          style={
-                            {
-                              "display": "flex",
-                              "flexDirection": "column",
-                              "gap": "0.5rem",
-                              "marginBottom": "1rem",
-                            }
-                          }
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            htmlFor="root_tags_0"
+                          <div
+                            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                           >
-                            tags-1
-                             
-                            *
-                          </label>
-                          <input
-                            aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                            autoFocus={false}
-                            className="p-inputtext p-component p-filled"
-                            data-pc-name="inputtext"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_0"
-                            name="root[tags][0]"
-                            onBeforeInput={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            onInput={[Function]}
-                            onKeyDown={[Function]}
-                            onPaste={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="developer"
-                          />
+                            <label
+                              for="root_tags_0"
+                            >
+                              tags-1 *
+                            </label>
+                            <input
+                              aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                              class="p-inputtext p-component p-filled"
+                              data-pc-name="inputtext"
+                              data-pc-section="root"
+                              id="root_tags_0"
+                              name="root[tags][0]"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="developer"
+                            />
+                          </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      style={
-                        {
-                          "position": "relative",
-                        }
-                      }
-                    >
                       <div
-                        style={
-                          {
-                            "position": "absolute",
-                            "right": 0,
-                            "top": "-10px",
-                          }
-                        }
+                        style="position: relative;"
                       >
                         <div
-                          style={
-                            {
-                              "flexDirection": "row",
-                            }
-                          }
+                          style="position: absolute; right: 0px; top: -10px;"
                         >
-                          <button
-                            className="rjsf-array-item-move-up p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_1__moveUp"
-                            onClick={[Function]}
-                            title="Move up"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-up"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-move-down p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={true}
-                            id="root_tags_1__moveDown"
-                            onClick={[Function]}
-                            title="Move down"
+                          <div
+                            style="flex-direction: row;"
                           >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-down"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_1__remove"
-                            onClick={[Function]}
-                            title="Remove"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-trash"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
+                            <button
+                              class="rjsf-array-item-move-up p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_tags_1__moveUp"
+                              title="Move up"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-up"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-move-down p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              disabled=""
+                              id="root_tags_1__moveDown"
+                              title="Move down"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-down"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_tags_1__remove"
+                              title="Remove"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-trash"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                          </div>
                         </div>
-                      </div>
-                      <div
-                        className="rjsf-field rjsf-field-string"
-                      >
                         <div
-                          style={
-                            {
-                              "display": "flex",
-                              "flexDirection": "column",
-                              "gap": "0.5rem",
-                              "marginBottom": "1rem",
-                            }
-                          }
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            htmlFor="root_tags_1"
+                          <div
+                            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                           >
-                            tags-2
-                             
-                            *
-                          </label>
-                          <input
-                            aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                            autoFocus={false}
-                            className="p-inputtext p-component p-filled"
-                            data-pc-name="inputtext"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_tags_1"
-                            name="root[tags][1]"
-                            onBeforeInput={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            onInput={[Function]}
-                            onKeyDown={[Function]}
-                            onPaste={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="designer"
-                          />
+                            <label
+                              for="root_tags_1"
+                            >
+                              tags-2 *
+                            </label>
+                            <input
+                              aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                              class="p-inputtext p-component p-filled"
+                              data-pc-name="inputtext"
+                              data-pc-section="root"
+                              id="root_tags_1"
+                              name="root[tags][1]"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="designer"
+                            />
+                          </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    style={
-                      {
-                        "marginTop": "1rem",
-                        "position": "relative",
-                        "textAlign": "right",
-                      }
-                    }
-                  >
-                    <button
-                      aria-label="Add Item"
-                      className="rjsf-array-item-add p-button p-component p-button-outlined p-button-sm p-button-secondary"
-                      data-pc-name="button"
-                      data-pc-section="root"
-                      disabled={false}
-                      id="root_tags__add"
-                      onClick={[Function]}
+                    <div
+                      style="margin-top: 1rem; position: relative; text-align: right;"
                     >
-                      <span
-                        className="p-button-icon p-c p-button-icon-left pi pi-plus"
-                        data-pc-section="icon"
-                      />
-                      <span
-                        className="p-button-label p-c"
-                        data-pc-section="label"
+                      <button
+                        aria-label="Add Item"
+                        class="rjsf-array-item-add p-button p-component p-button-outlined p-button-sm p-button-secondary"
+                        data-pc-name="button"
+                        data-pc-section="root"
+                        id="root_tags__add"
                       >
-                        Add Item
-                      </span>
-                    </button>
+                        <span
+                          class="p-button-icon p-c p-button-icon-left pi pi-plus"
+                          data-pc-section="icon"
+                        />
+                        <span
+                          class="p-button-label p-c"
+                          data-pc-section="label"
+                        >
+                          Add Item
+                        </span>
+                      </button>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-          </fieldset>
+            </fieldset>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_firstName"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            firstName
-             
-          </label>
-          <input
-            aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_firstName"
-            name="root[firstName]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+            <label
+              for="root_firstName"
+            >
+              firstName 
+            </label>
+            <input
+              aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_firstName"
+              name="root[firstName]"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_lastName"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            lastName
-             
-          </label>
-          <input
-            aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_lastName"
-            name="root[lastName]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+            <label
+              for="root_lastName"
+            >
+              lastName 
+            </label>
+            <input
+              aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_lastName"
+              name="root[lastName]"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_age"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            age
-             
-          </label>
-          <input
-            aria-describedby="root_age__error root_age__description root_age__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_age"
-            name="root[age]"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
+            <label
+              for="root_age"
+            >
+              age 
+            </label>
+            <input
+              aria-describedby="root_age__error root_age__description root_age__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_age"
+              name="root[age]"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-object"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-object"
         >
           <div
-            id="root_person__title"
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            <h5
-              style={
-                {
-                  "fontSize": "1.2rem",
-                  "margin": 0,
-                }
-              }
-            >
-              person
-               
-            </h5>
             <div
-              aria-orientation="horizontal"
-              className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-              data-pc-name="divider"
-              data-pc-section="root"
-              role="separator"
-              style={
-                {
-                  "alignItems": null,
-                  "justifyContent": "center",
-                  "marginTop": "0.5rem",
-                }
-              }
+              id="root_person__title"
             >
+              <h5
+                style="margin: 0px; font-size: 1.2rem;"
+              >
+                person 
+              </h5>
               <div
-                className="p-divider-content"
-                data-pc-section="content"
-              />
+                aria-orientation="horizontal"
+                class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+                data-pc-name="divider"
+                data-pc-section="root"
+                role="separator"
+                style="justify-content: center; margin-top: 0.5rem;"
+              >
+                <div
+                  class="p-divider-content"
+                  data-pc-section="content"
+                />
+              </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-string"
-          >
             <div
-              style={
-                {
-                  "display": "flex",
-                  "flexDirection": "column",
-                  "gap": "0.5rem",
-                  "marginBottom": "1rem",
-                }
-              }
+              class="rjsf-field rjsf-field-string"
             >
-              <label
-                htmlFor="root_person_name"
+              <div
+                style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
               >
-                name
-                 
-              </label>
-              <input
-                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                autoFocus={false}
-                className="p-inputtext p-component"
-                data-pc-name="inputtext"
-                data-pc-section="root"
-                disabled={false}
-                id="root_person_name"
-                name="root.person.name"
-                onBeforeInput={[Function]}
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                onInput={[Function]}
-                onKeyDown={[Function]}
-                onPaste={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+                <label
+                  for="root_person_name"
+                >
+                  name 
+                </label>
+                <input
+                  aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                  class="p-inputtext p-component"
+                  data-pc-name="inputtext"
+                  data-pc-section="root"
+                  id="root_person_name"
+                  name="root.person.name"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-object"
-          >
             <div
-              style={
-                {
-                  "display": "flex",
-                  "flexDirection": "column",
-                  "gap": "0.5rem",
-                  "marginBottom": "1rem",
-                }
-              }
+              class="rjsf-field rjsf-field-object"
             >
               <div
-                id="root_person_address__title"
+                style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
               >
-                <h5
-                  style={
-                    {
-                      "fontSize": "1.2rem",
-                      "margin": 0,
-                    }
-                  }
-                >
-                  address
-                   
-                </h5>
                 <div
-                  aria-orientation="horizontal"
-                  className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-                  data-pc-name="divider"
-                  data-pc-section="root"
-                  role="separator"
-                  style={
-                    {
-                      "alignItems": null,
-                      "justifyContent": "center",
-                      "marginTop": "0.5rem",
-                    }
-                  }
+                  id="root_person_address__title"
                 >
+                  <h5
+                    style="margin: 0px; font-size: 1.2rem;"
+                  >
+                    address 
+                  </h5>
                   <div
-                    className="p-divider-content"
-                    data-pc-section="content"
-                  />
+                    aria-orientation="horizontal"
+                    class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+                    data-pc-name="divider"
+                    data-pc-section="root"
+                    role="separator"
+                    style="justify-content: center; margin-top: 0.5rem;"
+                  >
+                    <div
+                      class="p-divider-content"
+                      data-pc-section="content"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  style={
-                    {
-                      "display": "flex",
-                      "flexDirection": "column",
-                      "gap": "0.5rem",
-                      "marginBottom": "1rem",
-                    }
-                  }
+                  class="rjsf-field rjsf-field-string"
                 >
-                  <label
-                    htmlFor="root_person_address_street"
+                  <div
+                    style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                   >
-                    street
-                     
-                  </label>
-                  <input
-                    aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                    autoFocus={false}
-                    className="p-inputtext p-component"
-                    data-pc-name="inputtext"
-                    data-pc-section="root"
-                    disabled={false}
-                    id="root_person_address_street"
-                    name="root.person.address.street"
-                    onBeforeInput={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                    <label
+                      for="root_person_address_street"
+                    >
+                      street 
+                    </label>
+                    <input
+                      aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                      class="p-inputtext p-component"
+                      data-pc-name="inputtext"
+                      data-pc-section="root"
+                      id="root_person_address_street"
+                      name="root.person.address.street"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  style={
-                    {
-                      "display": "flex",
-                      "flexDirection": "column",
-                      "gap": "0.5rem",
-                      "marginBottom": "1rem",
-                    }
-                  }
+                  class="rjsf-field rjsf-field-string"
                 >
-                  <label
-                    htmlFor="root_person_address_city"
+                  <div
+                    style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                   >
-                    city
-                     
-                  </label>
-                  <input
-                    aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                    autoFocus={false}
-                    className="p-inputtext p-component"
-                    data-pc-name="inputtext"
-                    data-pc-section="root"
-                    disabled={false}
-                    id="root_person_address_city"
-                    name="root.person.address.city"
-                    onBeforeInput={[Function]}
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    onInput={[Function]}
-                    onKeyDown={[Function]}
-                    onPaste={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                    <label
+                      for="root_person_address_city"
+                    >
+                      city 
+                    </label>
+                    <input
+                      aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                      class="p-inputtext p-component"
+                      data-pc-name="inputtext"
+                      data-pc-section="root"
+                      id="root_person_address_city"
+                      name="root.person.address.city"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -1521,3392 +963,2208 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_name"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            name
-             
-          </label>
-          <input
-            aria-describedby="root_name__error root_name__description root_name__help"
-            autoFocus={false}
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_name"
-            name="root.name"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value="Test"
-          />
+            <label
+              for="root_name"
+            >
+              name 
+            </label>
+            <input
+              aria-describedby="root_name__error root_name__description root_name__help"
+              class="p-inputtext p-component p-filled"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_name"
+              name="root.name"
+              placeholder=""
+              type="text"
+              value="Test"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_count"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            count
-             
-          </label>
-          <input
-            aria-describedby="root_count__error root_count__description root_count__help"
-            autoFocus={false}
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_count"
-            name="root.count"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value={5}
-          />
+            <label
+              for="root_count"
+            >
+              count 
+            </label>
+            <input
+              aria-describedby="root_count__error root_count__description root_count__help"
+              class="p-inputtext p-component p-filled"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_count"
+              name="root.count"
+              placeholder=""
+              step="any"
+              type="number"
+              value="5"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-array"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-array"
         >
-          <h5
-            id="root_items__title"
-            style={
-              {
-                "fontSize": "1.5rem",
-                "margin": 0,
-                "marginBottom": "0.2rem",
-              }
-            }
-          >
-            items
-             
-          </h5>
-          <fieldset
-            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields p-fieldset p-component"
-            data-pc-name="fieldset"
-            data-pc-section="root"
-            formData={
-              [
-                "a",
-                "b",
-              ]
-            }
-            id="root_items"
-            onClick={null}
-            style={{}}
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            <div
-              aria-labelledby="root_items_header"
-              className="p-toggleable-content"
-              data-pc-section="toggleablecontent"
-              id="root_items_content"
-              role="region"
+            <h5
+              id="root_items__title"
+              style="margin: 0px 0px 0.2rem 0px; font-size: 1.5rem;"
+            >
+              items 
+            </h5>
+            <fieldset
+              class="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields p-fieldset p-component"
+              data-pc-name="fieldset"
+              data-pc-section="root"
+              formdata="a,b"
+              id="root_items"
             >
               <div
-                className="p-fieldset-content"
-                data-pc-section="content"
+                aria-labelledby="root_items_header"
+                class="p-toggleable-content"
+                data-pc-section="toggleablecontent"
+                id="root_items_content"
+                role="region"
               >
-                <div>
+                <div
+                  class="p-fieldset-content"
+                  data-pc-section="content"
+                >
                   <div>
-                    <div
-                      style={
-                        {
-                          "position": "relative",
-                        }
-                      }
-                    >
+                    <div>
                       <div
-                        style={
-                          {
-                            "position": "absolute",
-                            "right": 0,
-                            "top": "-10px",
-                          }
-                        }
+                        style="position: relative;"
                       >
                         <div
-                          style={
-                            {
-                              "flexDirection": "row",
-                            }
-                          }
+                          style="position: absolute; right: 0px; top: -10px;"
                         >
-                          <button
-                            className="rjsf-array-item-move-up p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={true}
-                            id="root_items_0__moveUp"
-                            onClick={[Function]}
-                            title="Move up"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-up"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-move-down p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_0__moveDown"
-                            onClick={[Function]}
-                            title="Move down"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-down"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_0__remove"
-                            onClick={[Function]}
-                            title="Remove"
+                          <div
+                            style="flex-direction: row;"
                           >
-                            <span
-                              className="p-button-icon p-c pi pi-trash"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
+                            <button
+                              class="rjsf-array-item-move-up p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              disabled=""
+                              id="root_items_0__moveUp"
+                              title="Move up"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-up"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-move-down p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_items_0__moveDown"
+                              title="Move down"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-down"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_items_0__remove"
+                              title="Remove"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-trash"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                          </div>
                         </div>
-                      </div>
-                      <div
-                        className="rjsf-field rjsf-field-string"
-                      >
                         <div
-                          style={
-                            {
-                              "display": "flex",
-                              "flexDirection": "column",
-                              "gap": "0.5rem",
-                              "marginBottom": "1rem",
-                            }
-                          }
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            htmlFor="root_items_0"
+                          <div
+                            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                           >
-                            items-1
-                             
-                            *
-                          </label>
-                          <input
-                            aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                            autoFocus={false}
-                            className="p-inputtext p-component p-filled"
-                            data-pc-name="inputtext"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_0"
-                            name="root.items.0"
-                            onBeforeInput={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            onInput={[Function]}
-                            onKeyDown={[Function]}
-                            onPaste={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="a"
-                          />
+                            <label
+                              for="root_items_0"
+                            >
+                              items-1 *
+                            </label>
+                            <input
+                              aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                              class="p-inputtext p-component p-filled"
+                              data-pc-name="inputtext"
+                              data-pc-section="root"
+                              id="root_items_0"
+                              name="root.items.0"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="a"
+                            />
+                          </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      style={
-                        {
-                          "position": "relative",
-                        }
-                      }
-                    >
                       <div
-                        style={
-                          {
-                            "position": "absolute",
-                            "right": 0,
-                            "top": "-10px",
-                          }
-                        }
+                        style="position: relative;"
                       >
                         <div
-                          style={
-                            {
-                              "flexDirection": "row",
-                            }
-                          }
+                          style="position: absolute; right: 0px; top: -10px;"
                         >
-                          <button
-                            className="rjsf-array-item-move-up p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_1__moveUp"
-                            onClick={[Function]}
-                            title="Move up"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-up"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-move-down p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={true}
-                            id="root_items_1__moveDown"
-                            onClick={[Function]}
-                            title="Move down"
-                          >
-                            <span
-                              className="p-button-icon p-c pi pi-angle-down"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
-                          <button
-                            className="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
-                            data-pc-name="button"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_1__remove"
-                            onClick={[Function]}
-                            title="Remove"
+                          <div
+                            style="flex-direction: row;"
                           >
-                            <span
-                              className="p-button-icon p-c pi pi-trash"
-                              data-pc-section="icon"
-                            />
-                            <span
-                              className="p-button-label p-c"
-                              dangerouslySetInnerHTML={
-                                {
-                                  "__html": "&nbsp;",
-                                }
-                              }
-                              data-pc-section="label"
-                            />
-                          </button>
+                            <button
+                              class="rjsf-array-item-move-up p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_items_1__moveUp"
+                              title="Move up"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-up"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-move-down p-button p-component p-button-icon-only p-disabled p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              disabled=""
+                              id="root_items_1__moveDown"
+                              title="Move down"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-angle-down"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                            <button
+                              class="rjsf-array-item-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+                              data-pc-name="button"
+                              data-pc-section="root"
+                              id="root_items_1__remove"
+                              title="Remove"
+                            >
+                              <span
+                                class="p-button-icon p-c pi pi-trash"
+                                data-pc-section="icon"
+                              />
+                              <span
+                                class="p-button-label p-c"
+                                data-pc-section="label"
+                              >
+                                 
+                              </span>
+                            </button>
+                          </div>
                         </div>
-                      </div>
-                      <div
-                        className="rjsf-field rjsf-field-string"
-                      >
                         <div
-                          style={
-                            {
-                              "display": "flex",
-                              "flexDirection": "column",
-                              "gap": "0.5rem",
-                              "marginBottom": "1rem",
-                            }
-                          }
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            htmlFor="root_items_1"
+                          <div
+                            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
                           >
-                            items-2
-                             
-                            *
-                          </label>
-                          <input
-                            aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                            autoFocus={false}
-                            className="p-inputtext p-component p-filled"
-                            data-pc-name="inputtext"
-                            data-pc-section="root"
-                            disabled={false}
-                            id="root_items_1"
-                            name="root.items.1"
-                            onBeforeInput={[Function]}
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            onInput={[Function]}
-                            onKeyDown={[Function]}
-                            onPaste={[Function]}
-                            placeholder=""
-                            required={true}
-                            type="text"
-                            value="b"
-                          />
+                            <label
+                              for="root_items_1"
+                            >
+                              items-2 *
+                            </label>
+                            <input
+                              aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                              class="p-inputtext p-component p-filled"
+                              data-pc-name="inputtext"
+                              data-pc-section="root"
+                              id="root_items_1"
+                              name="root.items.1"
+                              placeholder=""
+                              required=""
+                              type="text"
+                              value="b"
+                            />
+                          </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    style={
-                      {
-                        "marginTop": "1rem",
-                        "position": "relative",
-                        "textAlign": "right",
-                      }
-                    }
-                  >
-                    <button
-                      aria-label="Add Item"
-                      className="rjsf-array-item-add p-button p-component p-button-outlined p-button-sm p-button-secondary"
-                      data-pc-name="button"
-                      data-pc-section="root"
-                      disabled={false}
-                      id="root_items__add"
-                      onClick={[Function]}
+                    <div
+                      style="margin-top: 1rem; position: relative; text-align: right;"
                     >
-                      <span
-                        className="p-button-icon p-c p-button-icon-left pi pi-plus"
-                        data-pc-section="icon"
-                      />
-                      <span
-                        className="p-button-label p-c"
-                        data-pc-section="label"
+                      <button
+                        aria-label="Add Item"
+                        class="rjsf-array-item-add p-button p-component p-button-outlined p-button-sm p-button-secondary"
+                        data-pc-name="button"
+                        data-pc-section="root"
+                        id="root_items__add"
                       >
-                        Add Item
-                      </span>
-                    </button>
+                        <span
+                          class="p-button-icon p-c p-button-icon-left pi pi-plus"
+                          data-pc-section="icon"
+                        />
+                        <span
+                          class="p-button-label p-c"
+                          data-pc-section="label"
+                        >
+                          Add Item
+                        </span>
+                      </button>
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-          </fieldset>
+            </fieldset>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_firstName"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            firstName
-             
-          </label>
-          <input
-            aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_firstName"
-            name="root.firstName"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+            <label
+              for="root_firstName"
+            >
+              firstName 
+            </label>
+            <input
+              aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_firstName"
+              name="root.firstName"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_lastName"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            lastName
-             
-          </label>
-          <input
-            aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_lastName"
-            name="root.lastName"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+            <label
+              for="root_lastName"
+            >
+              lastName 
+            </label>
+            <input
+              aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_lastName"
+              name="root.lastName"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_age"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            age
-             
-          </label>
-          <input
-            aria-describedby="root_age__error root_age__description root_age__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_age"
-            name="root.age"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
+            <label
+              for="root_age"
+            >
+              age 
+            </label>
+            <input
+              aria-describedby="root_age__error root_age__description root_age__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_age"
+              name="root.age"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
-        >
-          <label
-            htmlFor="root_foo-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
-          >
-            foo Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="foo"
-            disabled={false}
-            id="root_foo-key"
-            name="root_foo-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
-        </div>
-        <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_foo"
+              for="root_foo-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              foo
-               
+              foo Key
             </label>
             <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_foo"
-              name="root_foo"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
+              id="root_foo-key"
+              name="root_foo-key"
+              style="width: 100%;"
               value="foo"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_foo"
+              >
+                foo 
+              </label>
+              <input
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_foo"
+                name="root_foo"
+                placeholder=""
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_foo__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_foo__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_a"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            A
-             
-          </label>
-          <input
-            aria-describedby="root_a__error root_a__description root_a__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_a"
-            name="root_a"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+            <label
+              for="root_a"
+            >
+              A 
+            </label>
+            <input
+              aria-describedby="root_a__error root_a__description root_a__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_a"
+              name="root_a"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_b"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            B
-             
-          </label>
-          <input
-            aria-describedby="root_b__error root_b__description root_b__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_b"
-            name="root_b"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
+            <label
+              for="root_b"
+            >
+              B 
+            </label>
+            <input
+              aria-describedby="root_b__error root_b__description root_b__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_b"
+              name="root_b"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
-        >
-          <label
-            htmlFor="root_additionalProperty-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
-          >
-            additionalProperty Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="additionalProperty"
-            disabled={false}
-            id="root_additionalProperty-key"
-            name="root_additionalProperty-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
-        </div>
-        <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_additionalProperty"
+              for="root_additionalProperty-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              additionalProperty
-               
+              additionalProperty Key
             </label>
             <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_additionalProperty"
-              name="root_additionalProperty"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="should appear"
+              id="root_additionalProperty-key"
+              name="root_additionalProperty-key"
+              style="width: 100%;"
+              value="additionalProperty"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_additionalProperty"
+              >
+                additionalProperty 
+              </label>
+              <input
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
+                type="text"
+                value="should appear"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_additionalProperty__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_additionalProperty__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          Test field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            Test field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
-        >
-          a test description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          style="margin-bottom: 1rem;"
         >
-          <label
-            htmlFor="root_foo-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <span
+            id="root__description"
           >
-            foo Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="foo"
-            disabled={false}
-            id="root_foo-key"
-            name="root_foo-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            a test description
+          </span>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_foo"
+              for="root_foo-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              foo
-               
+              foo Key
             </label>
             <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_foo"
-              name="root_foo"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="foo"
-            />
+              id="root_foo-key"
+              name="root_foo-key"
+              style="width: 100%;"
+              value="foo"
+            />
+          </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_foo"
+              >
+                foo 
+              </label>
+              <input
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_foo"
+                name="root_foo"
+                placeholder=""
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_foo__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
           </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_foo__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          My Field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            My Field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
-        >
-          a fancier description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          style="margin-bottom: 1rem;"
         >
-          <label
-            htmlFor="root_foo-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <span
+            id="root__description"
           >
-            foo Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="foo"
-            disabled={false}
-            id="root_foo-key"
-            name="root_foo-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            a fancier description
+          </span>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_foo"
+              for="root_foo-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              foo
-               
+              foo Key
             </label>
             <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_foo"
-              name="root_foo"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
+              id="root_foo-key"
+              name="root_foo-key"
+              style="width: 100%;"
               value="foo"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_foo"
+              >
+                foo 
+              </label>
+              <input
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_foo"
+                name="root_foo"
+                placeholder=""
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_foo__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_foo__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          My Field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            My Field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
+        <div
+          style="margin-bottom: 1rem;"
         >
-          a fancier description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
+          <span
+            id="root__description"
+          >
+            a fancier description
+          </span>
+        </div>
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_a"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            My Item A
-             
-          </label>
-          <input
-            aria-describedby="root_a__error root_a__description root_a__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_a"
-            name="root_a"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
-          <small>
-            <span
-              id="root_a__description"
+            <label
+              for="root_a"
             >
-              a fancier item A description
-            </span>
-          </small>
+              My Item A 
+            </label>
+            <input
+              aria-describedby="root_a__error root_a__description root_a__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_a"
+              name="root_a"
+              placeholder=""
+              type="text"
+              value=""
+            />
+            <small>
+              <span
+                id="root_a__description"
+              >
+                a fancier item A description
+              </span>
+            </small>
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_b"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            My Item B
-             
-          </label>
-          <input
-            aria-describedby="root_b__error root_b__description root_b__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_b"
-            name="root_b"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
-          <small>
-            <span
-              id="root_b__description"
+            <label
+              for="root_b"
             >
-              a fancier item B description
-            </span>
-          </small>
+              My Item B 
+            </label>
+            <input
+              aria-describedby="root_b__error root_b__description root_b__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_b"
+              name="root_b"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+            <small>
+              <span
+                id="root_b__description"
+              >
+                a fancier item B description
+              </span>
+            </small>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          My Field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            My Field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
-        >
-          a fancier description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          style="margin-bottom: 1rem;"
         >
-          <label
-            htmlFor="root_foo-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <span
+            id="root__description"
           >
-            foo Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="foo"
-            disabled={false}
-            id="root_foo-key"
-            name="root_foo-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            a fancier description
+          </span>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_foo"
+              for="root_foo-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              foo
-               
+              foo Key
             </label>
             <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_foo"
-              name="root_foo"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
+              id="root_foo-key"
+              name="root_foo-key"
+              style="width: 100%;"
               value="foo"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_foo"
+              >
+                foo 
+              </label>
+              <input
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_foo"
+                name="root_foo"
+                placeholder=""
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_foo__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_foo__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          My Field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            My Field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
+        <div
+          style="margin-bottom: 1rem;"
         >
-          a fancier description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
+          <span
+            id="root__description"
+          >
+            a fancier description
+          </span>
+        </div>
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_a"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            My Item A
-             
-          </label>
-          <input
-            aria-describedby="root_a__error root_a__description root_a__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_a"
-            name="root_a"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
-          <small>
-            <span
-              id="root_a__description"
+            <label
+              for="root_a"
             >
-              a fancier item A description
-            </span>
-          </small>
+              My Item A 
+            </label>
+            <input
+              aria-describedby="root_a__error root_a__description root_a__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_a"
+              name="root_a"
+              placeholder=""
+              type="text"
+              value=""
+            />
+            <small>
+              <span
+                id="root_a__description"
+              >
+                a fancier item A description
+              </span>
+            </small>
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_b"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            My Item B
-             
-          </label>
-          <input
-            aria-describedby="root_b__error root_b__description root_b__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_b"
-            name="root_b"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
-          <small>
-            <span
-              id="root_b__description"
+            <label
+              for="root_b"
             >
-              a fancier item B description
-            </span>
-          </small>
+              My Item B 
+            </label>
+            <input
+              aria-describedby="root_b__error root_b__description root_b__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_b"
+              name="root_b"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+            <small>
+              <span
+                id="root_b__description"
+              >
+                a fancier item B description
+              </span>
+            </small>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          My Field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            My Field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
-        >
-          a fancier description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          style="margin-bottom: 1rem;"
         >
-          <label
-            htmlFor="root_additionalProperty-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <span
+            id="root__description"
           >
-            additionalProperty Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="additionalProperty"
-            disabled={false}
-            id="root_additionalProperty-key"
-            name="root_additionalProperty-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            a fancier description
+          </span>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_additionalProperty"
+              for="root_additionalProperty-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              additionalProperty
-               
+              additionalProperty Key
             </label>
             <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_additionalProperty"
-              name="root_additionalProperty"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="should appear"
+              id="root_additionalProperty-key"
+              name="root_additionalProperty-key"
+              style="width: 100%;"
+              value="additionalProperty"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_additionalProperty"
+              >
+                additionalProperty 
+              </label>
+              <input
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
+                type="text"
+                value="should appear"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_additionalProperty__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_additionalProperty__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          Test field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            Test field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
+        <div
+          style="margin-bottom: 1rem;"
         >
-          a test description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
+          <span
+            id="root__description"
+          >
+            a test description
+          </span>
+        </div>
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <label
-            htmlFor="root_a"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            A
-             
-          </label>
-          <input
-            aria-describedby="root_a__error root_a__description root_a__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_a"
-            name="root_a"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
-          <small>
-            <span
-              id="root_a__description"
+            <label
+              for="root_a"
             >
-              A description
-            </span>
-          </small>
+              A 
+            </label>
+            <input
+              aria-describedby="root_a__error root_a__description root_a__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_a"
+              name="root_a"
+              placeholder=""
+              type="text"
+              value=""
+            />
+            <small>
+              <span
+                id="root_a__description"
+              >
+                A description
+              </span>
+            </small>
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <label
-            htmlFor="root_b"
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
           >
-            B
-             
-          </label>
-          <input
-            aria-describedby="root_b__error root_b__description root_b__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_b"
-            name="root_b"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
-          <small>
-            <span
-              id="root_b__description"
+            <label
+              for="root_b"
             >
-              B description
-            </span>
-          </small>
+              B 
+            </label>
+            <input
+              aria-describedby="root_b__error root_b__description root_b__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_b"
+              name="root_b"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+            <small>
+              <span
+                id="root_b__description"
+              >
+                B description
+              </span>
+            </small>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        id="root__title"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
-        <h5
-          style={
-            {
-              "fontSize": "1.5rem",
-              "margin": 0,
-            }
-          }
-        >
-          Test field
-           
-        </h5>
         <div
-          aria-orientation="horizontal"
-          className="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
-          data-pc-name="divider"
-          data-pc-section="root"
-          role="separator"
-          style={
-            {
-              "alignItems": null,
-              "justifyContent": "center",
-              "marginTop": "0.5rem",
-            }
-          }
+          id="root__title"
         >
+          <h5
+            style="margin: 0px; font-size: 1.5rem;"
+          >
+            Test field 
+          </h5>
           <div
-            className="p-divider-content"
-            data-pc-section="content"
-          />
+            aria-orientation="horizontal"
+            class="p-divider p-component p-divider-horizontal p-divider-solid p-divider-left"
+            data-pc-name="divider"
+            data-pc-section="root"
+            role="separator"
+            style="justify-content: center; margin-top: 0.5rem;"
+          >
+            <div
+              class="p-divider-content"
+              data-pc-section="content"
+            />
+          </div>
         </div>
-      </div>
-      <div
-        style={
-          {
-            "marginBottom": "1rem",
-          }
-        }
-      >
-        <span
-          id="root__description"
-        >
-          a test description
-        </span>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
-      >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          style="margin-bottom: 1rem;"
         >
-          <label
-            htmlFor="root_additionalProperty-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
+          <span
+            id="root__description"
           >
-            additionalProperty Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="additionalProperty"
-            disabled={false}
-            id="root_additionalProperty-key"
-            name="root_additionalProperty-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
+            a test description
+          </span>
         </div>
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
             <label
-              htmlFor="root_additionalProperty"
+              for="root_additionalProperty-key"
+              style="display: block; margin-bottom: 0.5rem;"
             >
-              additionalProperty
-               
+              additionalProperty Key
             </label>
             <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_additionalProperty"
-              name="root_additionalProperty"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="should appear"
+              id="root_additionalProperty-key"
+              name="root_additionalProperty-key"
+              style="width: 100%;"
+              value="additionalProperty"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <label
+                for="root_additionalProperty"
+              >
+                additionalProperty 
+              </label>
+              <input
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
+                type="text"
+                value="should appear"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_additionalProperty__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_additionalProperty__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
-        >
-          <label
-            htmlFor="root_foo-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
-          >
-            foo Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="foo"
-            disabled={false}
-            id="root_foo-key"
-            name="root_foo-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
-        </div>
-        <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
+            <label
+              for="root_foo-key"
+              style="display: block; margin-bottom: 0.5rem;"
+            >
+              foo Key
+            </label>
             <input
-              aria-describedby="root_foo__error root_foo__description root_foo__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_foo"
-              name="root_foo"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
+              id="root_foo-key"
+              name="root_foo-key"
+              style="width: 100%;"
               value="foo"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <input
+                aria-describedby="root_foo__error root_foo__description root_foo__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_foo"
+                name="root_foo"
+                placeholder=""
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_foo__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_foo__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-string"
         >
-          <input
-            aria-describedby="root_a__error root_a__description root_a__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_a"
-            name="root_a"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            type="text"
-            value=""
-          />
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+          >
+            <input
+              aria-describedby="root_a__error root_a__description root_a__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_a"
+              name="root_a"
+              placeholder=""
+              type="text"
+              value=""
+            />
+          </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          style={
-            {
-              "display": "flex",
-              "flexDirection": "column",
-              "gap": "0.5rem",
-              "marginBottom": "1rem",
-            }
-          }
+          class="rjsf-field rjsf-field-number"
         >
-          <input
-            aria-describedby="root_b__error root_b__description root_b__help"
-            autoFocus={false}
-            className="p-inputtext p-component"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            disabled={false}
-            id="root_b"
-            name="root_b"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onChange={[Function]}
-            onFocus={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            placeholder=""
-            required={false}
-            step="any"
-            type="number"
-            value=""
-          />
+          <div
+            style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+          >
+            <input
+              aria-describedby="root_b__error root_b__description root_b__help"
+              class="p-inputtext p-component"
+              data-pc-name="inputtext"
+              data-pc-section="root"
+              id="root_b"
+              name="root_b"
+              placeholder=""
+              step="any"
+              type="number"
+              value=""
+            />
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      style={
-        {
-          "display": "flex",
-          "flexDirection": "column",
-          "gap": "0.5rem",
-          "marginBottom": "1rem",
-        }
-      }
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
-        style={
-          {
-            "alignItems": "center",
-            "display": "flex",
-            "gap": "1rem",
-          }
-        }
+        style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
       >
         <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
-        >
-          <label
-            htmlFor="root_additionalProperty-key"
-            style={
-              {
-                "display": "block",
-                "marginBottom": "0.5rem",
-              }
-            }
-          >
-            additionalProperty Key
-          </label>
-          <input
-            className="p-inputtext p-component p-filled"
-            data-pc-name="inputtext"
-            data-pc-section="root"
-            defaultValue="additionalProperty"
-            disabled={false}
-            id="root_additionalProperty-key"
-            name="root_additionalProperty-key"
-            onBeforeInput={[Function]}
-            onBlur={[Function]}
-            onInput={[Function]}
-            onKeyDown={[Function]}
-            onPaste={[Function]}
-            required={false}
-            style={
-              {
-                "width": "100%",
-              }
-            }
-          />
-        </div>
-        <div
-          style={
-            {
-              "flex": 1,
-            }
-          }
+          class="rjsf-field rjsf-field-string"
+          style="display: flex; align-items: center; gap: 1rem;"
         >
           <div
-            style={
-              {
-                "display": "flex",
-                "flexDirection": "column",
-                "gap": "0.5rem",
-                "marginBottom": "1rem",
-              }
-            }
+            style="flex: 1 1 0%;"
           >
+            <label
+              for="root_additionalProperty-key"
+              style="display: block; margin-bottom: 0.5rem;"
+            >
+              additionalProperty Key
+            </label>
             <input
-              aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-              autoFocus={false}
-              className="p-inputtext p-component p-filled"
+              class="p-inputtext p-component p-filled"
               data-pc-name="inputtext"
               data-pc-section="root"
-              disabled={false}
-              id="root_additionalProperty"
-              name="root_additionalProperty"
-              onBeforeInput={[Function]}
-              onBlur={[Function]}
-              onChange={[Function]}
-              onFocus={[Function]}
-              onInput={[Function]}
-              onKeyDown={[Function]}
-              onPaste={[Function]}
-              placeholder=""
-              required={false}
-              type="text"
-              value="should appear"
+              id="root_additionalProperty-key"
+              name="root_additionalProperty-key"
+              style="width: 100%;"
+              value="additionalProperty"
             />
           </div>
+          <div
+            style="flex: 1 1 0%;"
+          >
+            <div
+              style="display: flex; flex-direction: column; gap: 0.5rem; margin-bottom: 1rem;"
+            >
+              <input
+                aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                class="p-inputtext p-component p-filled"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                id="root_additionalProperty"
+                name="root_additionalProperty"
+                placeholder=""
+                type="text"
+                value="should appear"
+              />
+            </div>
+          </div>
+          <div>
+            <button
+              class="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+              data-pc-name="button"
+              data-pc-section="root"
+              id="root_additionalProperty__remove"
+              title="Remove"
+            >
+              <span
+                class="p-button-icon p-c pi pi-trash"
+                data-pc-section="icon"
+              />
+              <span
+                class="p-button-label p-c"
+                data-pc-section="label"
+              >
+                 
+              </span>
+            </button>
+          </div>
         </div>
-        <div>
+        <div
+          style="margin-top: 1rem; text-align: right;"
+        >
           <button
-            className="rjsf-object-property-remove p-button p-component p-button-icon-only p-button-text p-button-rounded p-button-secondary"
+            aria-label="Add Item"
+            class="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
             data-pc-name="button"
             data-pc-section="root"
-            disabled={false}
-            id="root_additionalProperty__remove"
-            onClick={[Function]}
-            title="Remove"
+            id="root__add"
           >
             <span
-              className="p-button-icon p-c pi pi-trash"
+              class="p-button-icon p-c p-button-icon-left pi pi-plus"
               data-pc-section="icon"
             />
             <span
-              className="p-button-label p-c"
-              dangerouslySetInnerHTML={
-                {
-                  "__html": "&nbsp;",
-                }
-              }
+              class="p-button-label p-c"
               data-pc-section="label"
-            />
+            >
+              Add Item
+            </span>
           </button>
         </div>
       </div>
-      <div
-        style={
-          {
-            "marginTop": "1rem",
-            "textAlign": "right",
-          }
-        }
-      >
-        <button
-          aria-label="Add Item"
-          className="rjsf-object-property-expand p-button p-component p-button-outlined p-button-sm p-button-secondary"
-          data-pc-name="button"
-          data-pc-section="root"
-          disabled={false}
-          id="root__add"
-          onClick={[Function]}
-        >
-          <span
-            className="p-button-icon p-c p-button-icon-left pi pi-plus"
-            data-pc-section="icon"
-          />
-          <span
-            className="p-button-label p-c"
-            data-pc-section="label"
-          >
-            Add Item
-          </span>
-        </button>
-      </div>
     </div>
-  </div>
-  <button
-    aria-label="Submit"
-    className="p-button p-component"
-    data-pc-name="button"
-    data-pc-section="root"
-    disabled={false}
-    type="submit"
-  >
-    <span
-      className="p-button-label p-c"
-      data-pc-section="label"
+    <button
+      aria-label="Submit"
+      class="p-button p-component"
+      data-pc-name="button"
+      data-pc-section="root"
+      type="submit"
     >
-      Submit
-    </span>
-  </button>
-</form>
+      <span
+        class="p-button-label p-c"
+        data-pc-section="label"
+      >
+        Submit
+      </span>
+    </button>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap b/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
index b43be620c0..f874379cf4 100644
--- a/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
@@ -1,252 +1,192 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-object"
+              class="col-12"
             >
-              <div>
-                <div
-                  className="my-1"
-                  id="root_person__title"
-                >
-                  <h5>
-                    person
-                  </h5>
-                  <hr
-                    className="border-0 bg-secondary mt-0"
-                    style={
-                      {
-                        "height": "1px",
-                      }
-                    }
-                  />
-                </div>
-                <div
-                  className="p-0 container-fluid"
-                >
+               
+              <div
+                class="rjsf-field rjsf-field-object"
+              >
+                <div>
+                  <div
+                    class="my-1"
+                    id="root_person__title"
+                  >
+                    <h5>
+                      person
+                    </h5>
+                    <hr
+                      class="border-0 bg-secondary mt-0"
+                      style="height: 1px;"
+                    />
+                  </div>
                   <div
-                    className="row"
-                    style={
-                      {
-                        "marginBottom": "10px",
-                      }
-                    }
+                    class="p-0 container-fluid"
                   >
                     <div
-                      className="col-12"
+                      class="row"
+                      style="margin-bottom: 10px;"
                     >
-                       
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="col-12"
                       >
-                        <div>
-                          <label
-                            className="form-label"
-                            htmlFor="root_person_name"
-                          >
-                            name
-                          </label>
-                          <input
-                            aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                            autoFocus={false}
-                            className="form-control"
-                            disabled={false}
-                            id="root_person_name"
-                            name="root[person][name]"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            readOnly={false}
-                            required={false}
-                            type="text"
-                            value=""
-                          />
+                         
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div>
+                            <label
+                              class="form-label"
+                              for="root_person_name"
+                            >
+                              name
+                            </label>
+                            <input
+                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                              class="form-control"
+                              id="root_person_name"
+                              name="root[person][name]"
+                              placeholder=""
+                              type="text"
+                              value=""
+                            />
+                          </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="row"
-                    style={
-                      {
-                        "marginBottom": "10px",
-                      }
-                    }
-                  >
                     <div
-                      className="col-12"
+                      class="row"
+                      style="margin-bottom: 10px;"
                     >
-                       
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class="col-12"
                       >
-                        <div>
-                          <div
-                            className="my-1"
-                            id="root_person_address__title"
-                          >
-                            <h5>
-                              address
-                            </h5>
-                            <hr
-                              className="border-0 bg-secondary mt-0"
-                              style={
-                                {
-                                  "height": "1px",
-                                }
-                              }
-                            />
-                          </div>
-                          <div
-                            className="p-0 container-fluid"
-                          >
+                         
+                        <div
+                          class="rjsf-field rjsf-field-object"
+                        >
+                          <div>
+                            <div
+                              class="my-1"
+                              id="root_person_address__title"
+                            >
+                              <h5>
+                                address
+                              </h5>
+                              <hr
+                                class="border-0 bg-secondary mt-0"
+                                style="height: 1px;"
+                              />
+                            </div>
                             <div
-                              className="row"
-                              style={
-                                {
-                                  "marginBottom": "10px",
-                                }
-                              }
+                              class="p-0 container-fluid"
                             >
                               <div
-                                className="col-12"
+                                class="row"
+                                style="margin-bottom: 10px;"
                               >
-                                 
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="col-12"
                                 >
-                                  <div>
-                                    <label
-                                      className="form-label"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      street
-                                    </label>
-                                    <input
-                                      aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                      autoFocus={false}
-                                      className="form-control"
-                                      disabled={false}
-                                      id="root_person_address_street"
-                                      name="root[person][address][street]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={false}
-                                      type="text"
-                                      value=""
-                                    />
+                                   
+                                  <div
+                                    class="rjsf-field rjsf-field-string"
+                                  >
+                                    <div>
+                                      <label
+                                        class="form-label"
+                                        for="root_person_address_street"
+                                      >
+                                        street
+                                      </label>
+                                      <input
+                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                        class="form-control"
+                                        id="root_person_address_street"
+                                        name="root[person][address][street]"
+                                        placeholder=""
+                                        type="text"
+                                        value=""
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="row"
-                              style={
-                                {
-                                  "marginBottom": "10px",
-                                }
-                              }
-                            >
                               <div
-                                className="col-12"
+                                class="row"
+                                style="margin-bottom: 10px;"
                               >
-                                 
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="col-12"
                                 >
-                                  <div>
-                                    <label
-                                      className="form-label"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      city
-                                    </label>
-                                    <input
-                                      aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                      autoFocus={false}
-                                      className="form-control"
-                                      disabled={false}
-                                      id="root_person_address_city"
-                                      name="root[person][address][city]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={false}
-                                      type="text"
-                                      value=""
-                                    />
+                                   
+                                  <div
+                                    class="rjsf-field rjsf-field-string"
+                                  >
+                                    <div>
+                                      <label
+                                        class="form-label"
+                                        for="root_person_address_city"
+                                      >
+                                        city
+                                      </label>
+                                      <input
+                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                        class="form-control"
+                                        id="root_person_address_city"
+                                        name="root[person][address][city]"
+                                        placeholder=""
+                                        type="text"
+                                        value=""
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="row"
-                              style={
-                                {
-                                  "marginBottom": "10px",
-                                }
-                              }
-                            >
                               <div
-                                className="col-12"
+                                class="row"
+                                style="margin-bottom: 10px;"
                               >
-                                 
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="col-12"
                                 >
-                                  <div>
-                                    <label
-                                      className="form-label"
-                                      htmlFor="root_person_address_country"
-                                    >
-                                      country
-                                    </label>
-                                    <input
-                                      aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                      autoFocus={false}
-                                      className="form-control"
-                                      disabled={false}
-                                      id="root_person_address_country"
-                                      name="root[person][address][country]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={false}
-                                      type="text"
-                                      value=""
-                                    />
+                                   
+                                  <div
+                                    class="rjsf-field rjsf-field-string"
+                                  >
+                                    <div>
+                                      <label
+                                        class="form-label"
+                                        for="root_person_address_country"
+                                      >
+                                        country
+                                      </label>
+                                      <input
+                                        aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                        class="form-control"
+                                        id="root_person_address_country"
+                                        name="root[person][address][country]"
+                                        placeholder=""
+                                        type="text"
+                                        value=""
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -263,673 +203,577 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="col-12"
-          >
-             
-            <div
-              className="rjsf-field rjsf-field-string"
-            >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_name"
-                  name="root[name]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value="John"
-                />
-              </div>
-            </div>
-          </div>
-        </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
-              >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_customField-key"
-                  >
-                    customField Key
-                  </label>
-                  <input
-                    className="form-control"
-                    defaultValue="customField"
-                    disabled={false}
-                    id="root_customField-key"
-                    name="root_customField-key"
-                    onBlur={[Function]}
-                    required={false}
-                    type="text"
-                  />
-                </div>
-              </div>
-              <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_customField"
+                    class="form-label"
+                    for="root_name"
                   >
-                    customField
+                    name
                   </label>
                   <input
-                    aria-describedby="root_customField__error root_customField__description root_customField__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_customField"
-                    name="root[customField]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="form-control"
+                    id="root_name"
+                    name="root[name]"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
                     type="text"
-                    value="customValue"
+                    value="John"
                   />
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="py-4 d-grid gap-2 col-2"
+                class="rjsf-field rjsf-field-string row"
               >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_customField__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
+                <div
+                  class="col-5"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_customField-key"
+                    >
+                      customField Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_customField-key"
+                      name="root_customField-key"
+                      type="text"
+                      value="customField"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_customField"
+                    >
+                      customField
+                    </label>
+                    <input
+                      aria-describedby="root_customField__error root_customField__description root_customField__help"
+                      class="form-control"
+                      id="root_customField"
+                      name="root[customField]"
+                      placeholder=""
+                      type="text"
+                      value="customValue"
                     />
-                  </svg>
-                </button>
+                  </div>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_customField__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="py-4 col-3 offset-9"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_name"
-                  name="root[name]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value="Alice"
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-string"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="form-control"
+                    id="root_name"
+                    name="root[name]"
+                    placeholder=""
+                    type="text"
+                    value="Alice"
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_age"
-                  name="root[age]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value={30}
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-number"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <input
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="form-control"
+                    id="root_age"
+                    name="root[age]"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value="30"
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-boolean"
+              class="col-12"
             >
-              <div>
-                <div
-                  aria-describedby="root_active__error root_active__description root_active__help"
-                  className=""
-                >
+               
+              <div
+                class="rjsf-field rjsf-field-boolean"
+              >
+                <div>
                   <div
-                    className="form-check"
+                    aria-describedby="root_active__error root_active__description root_active__help"
+                    class=""
                   >
-                    <input
-                      autoFocus={false}
-                      checked={true}
-                      className="form-check-input"
-                      disabled={false}
-                      id="root_active"
-                      name="root[active]"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      required={false}
-                      type="checkbox"
-                    />
-                    <label
-                      className="form-check-label"
-                      htmlFor="root_active"
-                      title=""
+                    <div
+                      class="form-check"
                     >
-                      active
-                    </label>
+                      <input
+                        checked=""
+                        class="form-check-input"
+                        id="root_active"
+                        name="root[active]"
+                        type="checkbox"
+                      />
+                      <label
+                        class="form-check-label"
+                        for="root_active"
+                        title=""
+                      >
+                        active
+                      </label>
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-array"
+              class="col-12"
             >
-              <div>
+               
+              <div
+                class="rjsf-field rjsf-field-array"
+              >
                 <div>
-                  <div
-                    className="p-0 m-0 row"
-                  >
+                  <div>
                     <div
-                      className="p-0 m-0 col"
+                      class="p-0 m-0 row"
                     >
                       <div
-                        className="my-1"
-                        id="root_tags__title"
+                        class="p-0 m-0 col"
                       >
-                        <h5>
-                          tags
-                        </h5>
-                        <hr
-                          className="border-0 bg-secondary mt-0"
-                          style={
-                            {
-                              "height": "1px",
-                            }
-                          }
-                        />
-                      </div>
-                      <div
-                        className="p-0 m-0 container-fluid"
-                      >
-                        <div>
-                          <div
-                            className="mb-2  d-flex align-items-center row"
-                          >
+                        <div
+                          class="my-1"
+                          id="root_tags__title"
+                        >
+                          <h5>
+                            tags
+                          </h5>
+                          <hr
+                            class="border-0 bg-secondary mt-0"
+                            style="height: 1px;"
+                          />
+                        </div>
+                        <div
+                          class="p-0 m-0 container-fluid"
+                        >
+                          <div>
                             <div
-                              className="col-lg-9 col-9"
+                              class="mb-2  d-flex align-items-center row"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="col-lg-9 col-9"
+                              >
+                                <div
+                                  class="rjsf-field rjsf-field-string"
+                                >
+                                  <div>
+                                    <label
+                                      class="form-label"
+                                      for="root_tags_0"
+                                    >
+                                      tags-1*
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                      class="form-control"
+                                      id="root_tags_0"
+                                      name="root[tags][0]"
+                                      placeholder=""
+                                      required=""
+                                      type="text"
+                                      value="developer"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                class="py-4 col-lg-3 col-3"
                               >
-                                <div>
-                                  <label
-                                    className="form-label"
-                                    htmlFor="root_tags_0"
+                                <div
+                                  class="d-flex flex-row"
+                                >
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    disabled=""
+                                    id="root_tags_0__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    tags-1
-                                    *
-                                  </label>
-                                  <input
-                                    aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                    autoFocus={false}
-                                    className="form-control"
-                                    disabled={false}
-                                    id="root_tags_0"
-                                    name="root[tags][0]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    readOnly={false}
-                                    required={true}
-                                    type="text"
-                                    value="developer"
-                                  />
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    id="root_tags_0__moveDown"
+                                    title="Move down"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-danger btn-sm"
+                                    id="root_tags_0__remove"
+                                    title="Remove"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 512 512"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      />
+                                    </svg>
+                                  </button>
                                 </div>
                               </div>
                             </div>
+                          </div>
+                          <div>
                             <div
-                              className="py-4 col-lg-3 col-3"
+                              class="mb-2  d-flex align-items-center row"
                             >
                               <div
-                                className="d-flex flex-row"
+                                class="col-lg-9 col-9"
                               >
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={true}
-                                  id="root_tags_0__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="rjsf-field rjsf-field-string"
                                 >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
-                                    <path
-                                      d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                  <div>
+                                    <label
+                                      class="form-label"
+                                      for="root_tags_1"
+                                    >
+                                      tags-2*
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                      class="form-control"
+                                      id="root_tags_1"
+                                      name="root[tags][1]"
+                                      placeholder=""
+                                      required=""
+                                      type="text"
+                                      value="designer"
                                     />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={false}
-                                  id="root_tags_0__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
-                                    <path
-                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-danger btn-sm"
-                                  disabled={false}
-                                  id="root_tags_0__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                class="py-4 col-lg-3 col-3"
+                              >
+                                <div
+                                  class="d-flex flex-row"
                                 >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 512 512"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    id="root_tags_1__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    disabled=""
+                                    id="root_tags_1__moveDown"
+                                    title="Move down"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-danger btn-sm"
+                                    id="root_tags_1__remove"
+                                    title="Remove"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 512 512"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div>
                           <div
-                            className="mb-2  d-flex align-items-center row"
+                            class="container"
                           >
                             <div
-                              className="col-lg-9 col-9"
+                              class="mt-2 row"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
-                              >
-                                <div>
-                                  <label
-                                    className="form-label"
-                                    htmlFor="root_tags_1"
-                                  >
-                                    tags-2
-                                    *
-                                  </label>
-                                  <input
-                                    aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                    autoFocus={false}
-                                    className="form-control"
-                                    disabled={false}
-                                    id="root_tags_1"
-                                    name="root[tags][1]"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    readOnly={false}
-                                    required={true}
-                                    type="text"
-                                    value="designer"
-                                  />
-                                </div>
-                              </div>
-                            </div>
-                            <div
-                              className="py-4 col-lg-3 col-3"
-                            >
+                                class="col-9"
+                              />
                               <div
-                                className="d-flex flex-row"
+                                class="py-4 col-lg-3 col-3 col-3"
                               >
                                 <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={false}
-                                  id="root_tags_1__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
-                                    <path
-                                      d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={true}
-                                  id="root_tags_1__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
+                                  class="ml-1 rjsf-array-item-add btn btn-primary"
+                                  id="root_tags__add"
+                                  style="width: 100%;"
+                                  title="Add Item"
                                   type="button"
                                 >
                                   <svg
                                     fill="currentColor"
                                     height="1em"
                                     stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
+                                    stroke-width="0"
+                                    viewBox="0 0 16 16"
                                     width="1em"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
-                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      clip-rule="evenodd"
+                                      d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                                      fill-rule="evenodd"
                                     />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-danger btn-sm"
-                                  disabled={false}
-                                  id="root_tags_1__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 512 512"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
                                     <path
-                                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      clip-rule="evenodd"
+                                      d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                                      fill-rule="evenodd"
                                     />
                                   </svg>
                                 </button>
@@ -937,60 +781,6 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
                             </div>
                           </div>
                         </div>
-                        <div
-                          className="container"
-                        >
-                          <div
-                            className="mt-2 row"
-                          >
-                            <div
-                              className="col-9"
-                            />
-                            <div
-                              className="py-4 col-lg-3 col-3 col-3"
-                            >
-                              <button
-                                className="ml-1 rjsf-array-item-add btn btn-primary"
-                                disabled={false}
-                                id="root_tags__add"
-                                onClick={[Function]}
-                                style={
-                                  {
-                                    "width": "100%",
-                                  }
-                                }
-                                title="Add Item"
-                                type="button"
-                              >
-                                <svg
-                                  fill="currentColor"
-                                  height="1em"
-                                  stroke="currentColor"
-                                  strokeWidth="0"
-                                  style={
-                                    {
-                                      "color": undefined,
-                                    }
-                                  }
-                                  viewBox="0 0 16 16"
-                                  width="1em"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                >
-                                  <path
-                                    clipRule="evenodd"
-                                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                                    fillRule="evenodd"
-                                  />
-                                  <path
-                                    clipRule="evenodd"
-                                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                                    fillRule="evenodd"
-                                  />
-                                </svg>
-                              </button>
-                            </div>
-                          </div>
-                        </div>
                       </div>
                     </div>
                   </div>
@@ -1001,379 +791,295 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_firstName"
-                >
-                  firstName
-                </label>
-                <input
-                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_firstName"
-                  name="root[firstName]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-string"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_firstName"
+                  >
+                    firstName
+                  </label>
+                  <input
+                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                    class="form-control"
+                    id="root_firstName"
+                    name="root[firstName]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_lastName"
-                >
-                  lastName
-                </label>
-                <input
-                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_lastName"
-                  name="root[lastName]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-string"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_lastName"
+                  >
+                    lastName
+                  </label>
+                  <input
+                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                    class="form-control"
+                    id="root_lastName"
+                    name="root[lastName]"
+                    placeholder=""
+                    type="text"
+                    value=""
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_age"
-                  name="root[age]"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-number"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <input
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="form-control"
+                    id="root_age"
+                    name="root[age]"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value=""
+                  />
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-object"
+              class="col-12"
             >
-              <div>
-                <div
-                  className="my-1"
-                  id="root_person__title"
-                >
-                  <h5>
-                    person
-                  </h5>
-                  <hr
-                    className="border-0 bg-secondary mt-0"
-                    style={
-                      {
-                        "height": "1px",
-                      }
-                    }
-                  />
-                </div>
-                <div
-                  className="p-0 container-fluid"
-                >
+               
+              <div
+                class="rjsf-field rjsf-field-object"
+              >
+                <div>
+                  <div
+                    class="my-1"
+                    id="root_person__title"
+                  >
+                    <h5>
+                      person
+                    </h5>
+                    <hr
+                      class="border-0 bg-secondary mt-0"
+                      style="height: 1px;"
+                    />
+                  </div>
                   <div
-                    className="row"
-                    style={
-                      {
-                        "marginBottom": "10px",
-                      }
-                    }
+                    class="p-0 container-fluid"
                   >
                     <div
-                      className="col-12"
+                      class="row"
+                      style="margin-bottom: 10px;"
                     >
-                       
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="col-12"
                       >
-                        <div>
-                          <label
-                            className="form-label"
-                            htmlFor="root_person_name"
-                          >
-                            name
-                          </label>
-                          <input
-                            aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                            autoFocus={false}
-                            className="form-control"
-                            disabled={false}
-                            id="root_person_name"
-                            name="root.person.name"
-                            onBlur={[Function]}
-                            onChange={[Function]}
-                            onFocus={[Function]}
-                            placeholder=""
-                            readOnly={false}
-                            required={false}
-                            type="text"
-                            value=""
-                          />
+                         
+                        <div
+                          class="rjsf-field rjsf-field-string"
+                        >
+                          <div>
+                            <label
+                              class="form-label"
+                              for="root_person_name"
+                            >
+                              name
+                            </label>
+                            <input
+                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                              class="form-control"
+                              id="root_person_name"
+                              name="root.person.name"
+                              placeholder=""
+                              type="text"
+                              value=""
+                            />
+                          </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className="row"
-                    style={
-                      {
-                        "marginBottom": "10px",
-                      }
-                    }
-                  >
                     <div
-                      className="col-12"
+                      class="row"
+                      style="margin-bottom: 10px;"
                     >
-                       
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class="col-12"
                       >
-                        <div>
-                          <div
-                            className="my-1"
-                            id="root_person_address__title"
-                          >
-                            <h5>
-                              address
-                            </h5>
-                            <hr
-                              className="border-0 bg-secondary mt-0"
-                              style={
-                                {
-                                  "height": "1px",
-                                }
-                              }
-                            />
-                          </div>
-                          <div
-                            className="p-0 container-fluid"
-                          >
+                         
+                        <div
+                          class="rjsf-field rjsf-field-object"
+                        >
+                          <div>
+                            <div
+                              class="my-1"
+                              id="root_person_address__title"
+                            >
+                              <h5>
+                                address
+                              </h5>
+                              <hr
+                                class="border-0 bg-secondary mt-0"
+                                style="height: 1px;"
+                              />
+                            </div>
                             <div
-                              className="row"
-                              style={
-                                {
-                                  "marginBottom": "10px",
-                                }
-                              }
+                              class="p-0 container-fluid"
                             >
                               <div
-                                className="col-12"
+                                class="row"
+                                style="margin-bottom: 10px;"
                               >
-                                 
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="col-12"
                                 >
-                                  <div>
-                                    <label
-                                      className="form-label"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      street
-                                    </label>
-                                    <input
-                                      aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                      autoFocus={false}
-                                      className="form-control"
-                                      disabled={false}
-                                      id="root_person_address_street"
-                                      name="root.person.address.street"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={false}
-                                      type="text"
-                                      value=""
-                                    />
+                                   
+                                  <div
+                                    class="rjsf-field rjsf-field-string"
+                                  >
+                                    <div>
+                                      <label
+                                        class="form-label"
+                                        for="root_person_address_street"
+                                      >
+                                        street
+                                      </label>
+                                      <input
+                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                        class="form-control"
+                                        id="root_person_address_street"
+                                        name="root.person.address.street"
+                                        placeholder=""
+                                        type="text"
+                                        value=""
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="row"
-                              style={
-                                {
-                                  "marginBottom": "10px",
-                                }
-                              }
-                            >
                               <div
-                                className="col-12"
+                                class="row"
+                                style="margin-bottom: 10px;"
                               >
-                                 
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="col-12"
                                 >
-                                  <div>
-                                    <label
-                                      className="form-label"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      city
-                                    </label>
-                                    <input
-                                      aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                      autoFocus={false}
-                                      className="form-control"
-                                      disabled={false}
-                                      id="root_person_address_city"
-                                      name="root.person.address.city"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={false}
-                                      type="text"
-                                      value=""
-                                    />
+                                   
+                                  <div
+                                    class="rjsf-field rjsf-field-string"
+                                  >
+                                    <div>
+                                      <label
+                                        class="form-label"
+                                        for="root_person_address_city"
+                                      >
+                                        city
+                                      </label>
+                                      <input
+                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                        class="form-control"
+                                        id="root_person_address_city"
+                                        name="root.person.address.city"
+                                        placeholder=""
+                                        type="text"
+                                        value=""
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
@@ -1390,408 +1096,366 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
-                <input
-                  aria-describedby="root_name__error root_name__description root_name__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_name"
-                  name="root.name"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value="Test"
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-string"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_name__error root_name__description root_name__help"
+                    class="form-control"
+                    id="root_name"
+                    name="root.name"
+                    placeholder=""
+                    type="text"
+                    value="Test"
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_count"
-                >
-                  count
-                </label>
-                <input
-                  aria-describedby="root_count__error root_count__description root_count__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_count"
-                  name="root.count"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value={5}
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-number"
+              >
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_count"
+                  >
+                    count
+                  </label>
+                  <input
+                    aria-describedby="root_count__error root_count__description root_count__help"
+                    class="form-control"
+                    id="root_count"
+                    name="root.count"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value="5"
+                  />
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-array"
+              class="col-12"
             >
-              <div>
+               
+              <div
+                class="rjsf-field rjsf-field-array"
+              >
                 <div>
-                  <div
-                    className="p-0 m-0 row"
-                  >
+                  <div>
                     <div
-                      className="p-0 m-0 col"
+                      class="p-0 m-0 row"
                     >
                       <div
-                        className="my-1"
-                        id="root_items__title"
-                      >
-                        <h5>
-                          items
-                        </h5>
-                        <hr
-                          className="border-0 bg-secondary mt-0"
-                          style={
-                            {
-                              "height": "1px",
-                            }
-                          }
-                        />
-                      </div>
-                      <div
-                        className="p-0 m-0 container-fluid"
+                        class="p-0 m-0 col"
                       >
-                        <div>
-                          <div
-                            className="mb-2  d-flex align-items-center row"
-                          >
+                        <div
+                          class="my-1"
+                          id="root_items__title"
+                        >
+                          <h5>
+                            items
+                          </h5>
+                          <hr
+                            class="border-0 bg-secondary mt-0"
+                            style="height: 1px;"
+                          />
+                        </div>
+                        <div
+                          class="p-0 m-0 container-fluid"
+                        >
+                          <div>
                             <div
-                              className="col-lg-9 col-9"
+                              class="mb-2  d-flex align-items-center row"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="col-lg-9 col-9"
                               >
-                                <div>
-                                  <label
-                                    className="form-label"
-                                    htmlFor="root_items_0"
-                                  >
-                                    items-1
-                                    *
-                                  </label>
-                                  <input
-                                    aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                    autoFocus={false}
-                                    className="form-control"
-                                    disabled={false}
-                                    id="root_items_0"
-                                    name="root.items.0"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    readOnly={false}
-                                    required={true}
-                                    type="text"
-                                    value="a"
-                                  />
+                                <div
+                                  class="rjsf-field rjsf-field-string"
+                                >
+                                  <div>
+                                    <label
+                                      class="form-label"
+                                      for="root_items_0"
+                                    >
+                                      items-1*
+                                    </label>
+                                    <input
+                                      aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                      class="form-control"
+                                      id="root_items_0"
+                                      name="root.items.0"
+                                      placeholder=""
+                                      required=""
+                                      type="text"
+                                      value="a"
+                                    />
+                                  </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="py-4 col-lg-3 col-3"
-                            >
                               <div
-                                className="d-flex flex-row"
+                                class="py-4 col-lg-3 col-3"
                               >
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={true}
-                                  id="root_items_0__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="d-flex flex-row"
                                 >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    disabled=""
+                                    id="root_items_0__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={false}
-                                  id="root_items_0__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    id="root_items_0__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-danger btn-sm"
-                                  disabled={false}
-                                  id="root_items_0__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 512 512"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-danger btn-sm"
+                                    id="root_items_0__remove"
+                                    title="Remove"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 512 512"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            className="mb-2  d-flex align-items-center row"
-                          >
+                          <div>
                             <div
-                              className="col-lg-9 col-9"
+                              class="mb-2  d-flex align-items-center row"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="col-lg-9 col-9"
+                              >
+                                <div
+                                  class="rjsf-field rjsf-field-string"
+                                >
+                                  <div>
+                                    <label
+                                      class="form-label"
+                                      for="root_items_1"
+                                    >
+                                      items-2*
+                                    </label>
+                                    <input
+                                      aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                      class="form-control"
+                                      id="root_items_1"
+                                      name="root.items.1"
+                                      placeholder=""
+                                      required=""
+                                      type="text"
+                                      value="b"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                class="py-4 col-lg-3 col-3"
                               >
-                                <div>
-                                  <label
-                                    className="form-label"
-                                    htmlFor="root_items_1"
+                                <div
+                                  class="d-flex flex-row"
+                                >
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    id="root_items_1__moveUp"
+                                    title="Move up"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-light btn-sm"
+                                    disabled=""
+                                    id="root_items_1__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    items-2
-                                    *
-                                  </label>
-                                  <input
-                                    aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                    autoFocus={false}
-                                    className="form-control"
-                                    disabled={false}
-                                    id="root_items_1"
-                                    name="root.items.1"
-                                    onBlur={[Function]}
-                                    onChange={[Function]}
-                                    onFocus={[Function]}
-                                    placeholder=""
-                                    readOnly={false}
-                                    required={true}
-                                    type="text"
-                                    value="b"
-                                  />
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 1024 1024"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="btn btn-danger btn-sm"
+                                    id="root_items_1__remove"
+                                    title="Remove"
+                                    type="button"
+                                  >
+                                    <svg
+                                      fill="currentColor"
+                                      height="1em"
+                                      stroke="currentColor"
+                                      stroke-width="0"
+                                      viewBox="0 0 512 512"
+                                      width="1em"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      />
+                                    </svg>
+                                  </button>
                                 </div>
                               </div>
                             </div>
+                          </div>
+                          <div
+                            class="container"
+                          >
                             <div
-                              className="py-4 col-lg-3 col-3"
+                              class="mt-2 row"
                             >
                               <div
-                                className="d-flex flex-row"
+                                class="col-9"
+                              />
+                              <div
+                                class="py-4 col-lg-3 col-3 col-3"
                               >
                                 <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={false}
-                                  id="root_items_1__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
-                                    <path
-                                      d="M868 545.5L536.1 163a31.96 31.96 0 0 0-48.3 0L156 545.5a7.97 7.97 0 0 0 6 13.2h81c4.6 0 9-2 12.1-5.5L474 300.9V864c0 4.4 3.6 8 8 8h60c4.4 0 8-3.6 8-8V300.9l218.9 252.3c3 3.5 7.4 5.5 12.1 5.5h81c6.8 0 10.5-8 6-13.2z"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-light btn-sm"
-                                  disabled={true}
-                                  id="root_items_1__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
+                                  class="ml-1 rjsf-array-item-add btn btn-primary"
+                                  id="root_items__add"
+                                  style="width: 100%;"
+                                  title="Add Item"
                                   type="button"
                                 >
                                   <svg
                                     fill="currentColor"
                                     height="1em"
                                     stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 1024 1024"
+                                    stroke-width="0"
+                                    viewBox="0 0 16 16"
                                     width="1em"
                                     xmlns="http://www.w3.org/2000/svg"
                                   >
                                     <path
-                                      d="M862 465.3h-81c-4.6 0-9 2-12.1 5.5L550 723.1V160c0-4.4-3.6-8-8-8h-60c-4.4 0-8 3.6-8 8v563.1L255.1 470.8c-3-3.5-7.4-5.5-12.1-5.5h-81c-6.8 0-10.5 8.1-6 13.2L487.9 861a31.96 31.96 0 0 0 48.3 0L868 478.5c4.5-5.2.8-13.2-6-13.2z"
+                                      clip-rule="evenodd"
+                                      d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                                      fill-rule="evenodd"
                                     />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="btn btn-danger btn-sm"
-                                  disabled={false}
-                                  id="root_items_1__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    fill="currentColor"
-                                    height="1em"
-                                    stroke="currentColor"
-                                    strokeWidth="0"
-                                    style={
-                                      {
-                                        "color": undefined,
-                                      }
-                                    }
-                                    viewBox="0 0 512 512"
-                                    width="1em"
-                                    xmlns="http://www.w3.org/2000/svg"
-                                  >
                                     <path
-                                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                                      clip-rule="evenodd"
+                                      d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                                      fill-rule="evenodd"
                                     />
                                   </svg>
                                 </button>
@@ -1799,60 +1463,6 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
                             </div>
                           </div>
                         </div>
-                        <div
-                          className="container"
-                        >
-                          <div
-                            className="mt-2 row"
-                          >
-                            <div
-                              className="col-9"
-                            />
-                            <div
-                              className="py-4 col-lg-3 col-3 col-3"
-                            >
-                              <button
-                                className="ml-1 rjsf-array-item-add btn btn-primary"
-                                disabled={false}
-                                id="root_items__add"
-                                onClick={[Function]}
-                                style={
-                                  {
-                                    "width": "100%",
-                                  }
-                                }
-                                title="Add Item"
-                                type="button"
-                              >
-                                <svg
-                                  fill="currentColor"
-                                  height="1em"
-                                  stroke="currentColor"
-                                  strokeWidth="0"
-                                  style={
-                                    {
-                                      "color": undefined,
-                                    }
-                                  }
-                                  viewBox="0 0 16 16"
-                                  width="1em"
-                                  xmlns="http://www.w3.org/2000/svg"
-                                >
-                                  <path
-                                    clipRule="evenodd"
-                                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                                    fillRule="evenodd"
-                                  />
-                                  <path
-                                    clipRule="evenodd"
-                                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                                    fillRule="evenodd"
-                                  />
-                                </svg>
-                              </button>
-                            </div>
-                          </div>
-                        </div>
                       </div>
                     </div>
                   </div>
@@ -1863,2541 +1473,2062 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
-`;
-
-exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
-  >
     <div>
-      <div
-        className="p-0 container-fluid"
+      <button
+        class="btn btn-primary"
+        type="submit"
       >
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="col-12"
-          >
-             
-            <div
-              className="rjsf-field rjsf-field-string"
-            >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_firstName"
-                >
-                  firstName
-                </label>
-                <input
-                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_firstName"
-                  name="root.firstName"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="col-12"
-          >
-             
-            <div
-              className="rjsf-field rjsf-field-string"
-            >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_lastName"
-                >
-                  lastName
-                </label>
-                <input
-                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_lastName"
-                  name="root.lastName"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
-          <div
-            className="col-12"
-          >
-             
-            <div
-              className="rjsf-field rjsf-field-number"
-            >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
-                <input
-                  aria-describedby="root_age__error root_age__description root_age__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_age"
-                  name="root.age"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
+        Submit
+      </button>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_foo-key"
+                    class="form-label"
+                    for="root_firstName"
                   >
-                    foo Key
+                    firstName
                   </label>
                   <input
-                    className="form-control"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                    class="form-control"
+                    id="root_firstName"
+                    name="root.firstName"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_foo"
+                    class="form-label"
+                    for="root_lastName"
                   >
-                    foo
+                    lastName
                   </label>
                   <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                    class="form-control"
+                    id="root_lastName"
+                    name="root.lastName"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
                     type="text"
-                    value="foo"
+                    value=""
                   />
                 </div>
               </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_foo__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
-                >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
-              </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="col-12"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+               
+              <div
+                class="rjsf-field rjsf-field-number"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <div>
+                  <label
+                    class="form-label"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <input
+                    aria-describedby="root_age__error root_age__description root_age__help"
+                    class="form-control"
+                    id="root_age"
+                    name="root.age"
+                    placeholder=""
+                    step="any"
+                    type="number"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_a"
+               
+              <div
+                class="rjsf-field rjsf-field-string row"
+              >
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="form-control"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
                 >
-                  A
-                </label>
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_foo__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="py-4 col-3 offset-9"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_b"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
+              >
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  B
-                </label>
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </div>
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty-key"
+                    class="form-label"
+                    for="root_a"
                   >
-                    additionalProperty Key
+                    A
                   </label>
                   <input
-                    className="form-control"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="form-control"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-number"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty"
+                    class="form-label"
+                    for="root_b"
                   >
-                    additionalProperty
+                    B
                   </label>
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="form-control"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </div>
               </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_additionalProperty__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
-                >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
-              </div>
             </div>
           </div>
         </div>
-        <div
-          className="row"
-        >
-          <div
-            className="py-4 col-3 offset-9"
-          >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          Test field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
-        >
-          a test description
-        </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string row"
               >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <input
-                    className="form-control"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    required={false}
-                    type="text"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty-key"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-5"
-              >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty
+                    </label>
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="form-control"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_foo__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
+                <div
+                  class="py-4 d-grid gap-2 col-2"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_additionalProperty__remove"
+                    title="Remove"
+                    type="button"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="py-4 col-3 offset-9"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          My Field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            Test field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a test description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string row"
               >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <input
-                    className="form-control"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    required={false}
-                    type="text"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-5"
-              >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="form-control"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_foo__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
+                <div
+                  class="py-4 d-grid gap-2 col-2"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_foo__remove"
+                    title="Remove"
+                    type="button"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="py-4 col-3 offset-9"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from both additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          My Field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_a"
+               
+              <div
+                class="rjsf-field rjsf-field-string row"
+              >
+                <div
+                  class="col-5"
                 >
-                  My Item A
-                </label>
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
                 >
                   <div>
-                    <div
-                      className="mb-3"
-                      id="root_a__description"
+                    <label
+                      class="form-label"
+                      for="root_foo"
                     >
-                      a fancier item A description
-                    </div>
+                      foo
+                    </label>
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="form-control"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
                   </div>
-                </small>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_foo__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="py-4 col-3 offset-9"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_b"
-                >
-                  My Item B
-                </label>
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
+              >
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  <div>
-                    <div
-                      className="mb-3"
-                      id="root_b__description"
-                    >
-                      a fancier item B description
-                    </div>
-                  </div>
-                </small>
-              </div>
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from both object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          My Field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_foo-key"
+                    class="form-label"
+                    for="root_a"
                   >
-                    foo Key
+                    My Item A
                   </label>
                   <input
-                    className="form-control"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="form-control"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
+                  <small
+                    class="text-muted form-text"
+                  >
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_a__description"
+                      >
+                        a fancier item A description
+                      </div>
+                    </div>
+                  </small>
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-number"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_foo"
+                    class="form-label"
+                    for="root_b"
                   >
-                    foo
+                    My Item B
                   </label>
                   <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="form-control"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="foo"
+                    step="any"
+                    type="number"
+                    value=""
                   />
-                </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_foo__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
-                >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <small
+                    class="text-muted form-text"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_b__description"
+                      >
+                        a fancier item B description
+                      </div>
+                    </div>
+                  </small>
+                </div>
               </div>
             </div>
           </div>
         </div>
-        <div
-          className="row"
-        >
-          <div
-            className="py-4 col-3 offset-9"
-          >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          My Field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_a"
+               
+              <div
+                class="rjsf-field rjsf-field-string row"
+              >
+                <div
+                  class="col-5"
                 >
-                  My Item A
-                </label>
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
                 >
                   <div>
-                    <div
-                      className="mb-3"
-                      id="root_a__description"
+                    <label
+                      class="form-label"
+                      for="root_foo"
                     >
-                      a fancier item A description
-                    </div>
+                      foo
+                    </label>
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="form-control"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
                   </div>
-                </small>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_foo__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="py-4 col-3 offset-9"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_b"
-                >
-                  My Item B
-                </label>
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
+              >
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  <div>
-                    <div
-                      className="mb-3"
-                      id="root_b__description"
-                    >
-                      a fancier item B description
-                    </div>
-                  </div>
-                </small>
-              </div>
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          My Field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty-key"
+                    class="form-label"
+                    for="root_a"
                   >
-                    additionalProperty Key
+                    My Item A
                   </label>
                   <input
-                    className="form-control"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="form-control"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
+                  <small
+                    class="text-muted form-text"
+                  >
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_a__description"
+                      >
+                        a fancier item A description
+                      </div>
+                    </div>
+                  </small>
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-number"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty"
+                    class="form-label"
+                    for="root_b"
                   >
-                    additionalProperty
+                    My Item B
                   </label>
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="form-control"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
-                </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_additionalProperty__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
-                >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <small
+                    class="text-muted form-text"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_b__description"
+                      >
+                        a fancier item B description
+                      </div>
+                    </div>
+                  </small>
+                </div>
               </div>
             </div>
           </div>
         </div>
-        <div
-          className="row"
-        >
-          <div
-            className="py-4 col-3 offset-9"
-          >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
-          </div>
-        </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          Test field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a test description
+          <h5>
+            My Field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_a"
+               
+              <div
+                class="rjsf-field rjsf-field-string row"
+              >
+                <div
+                  class="col-5"
                 >
-                  A
-                </label>
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty-key"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
                 >
                   <div>
-                    <div
-                      className="mb-3"
-                      id="root_a__description"
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty"
                     >
-                      A description
-                    </div>
+                      additionalProperty
+                    </label>
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="form-control"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
                   </div>
-                </small>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_additionalProperty__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="py-4 col-3 offset-9"
             >
-              <div>
-                <label
-                  className="form-label"
-                  htmlFor="root_b"
-                >
-                  B
-                </label>
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-                <small
-                  className="text-muted form-text"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
+              >
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
                 >
-                  <div>
-                    <div
-                      className="mb-3"
-                      id="root_b__description"
-                    >
-                      B description
-                    </div>
-                  </div>
-                </small>
-              </div>
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="my-1"
-        id="root__title"
-      >
-        <h5>
-          Test field
-        </h5>
-        <hr
-          className="border-0 bg-secondary mt-0"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
       <div>
         <div
-          className="mb-3"
-          id="root__description"
+          class="my-1"
+          id="root__title"
         >
-          a test description
+          <h5>
+            Test field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="mb-3"
+            id="root__description"
+          >
+            a test description
+          </div>
         </div>
-      </div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty-key"
+                    class="form-label"
+                    for="root_a"
                   >
-                    additionalProperty Key
+                    A
                   </label>
                   <input
-                    className="form-control"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="form-control"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
+                  <small
+                    class="text-muted form-text"
+                  >
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_a__description"
+                      >
+                        A description
+                      </div>
+                    </div>
+                  </small>
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-number"
               >
                 <div>
                   <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty"
+                    class="form-label"
+                    for="root_b"
                   >
-                    additionalProperty
+                    B
                   </label>
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="form-control"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
-                </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_additionalProperty__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
-                >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <small
+                    class="text-muted form-text"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <div>
+                      <div
+                        class="mb-3"
+                        id="root_b__description"
+                      >
+                        B description
+                      </div>
+                    </div>
+                  </small>
+                </div>
               </div>
             </div>
           </div>
         </div>
+      </div>
+    </div>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
+`;
+
+exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
+          class="my-1"
+          id="root__title"
         >
+          <h5>
+            Test field
+          </h5>
+          <hr
+            class="border-0 bg-secondary mt-0"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
           <div
-            className="py-4 col-3 offset-9"
+            class="mb-3"
+            id="root__description"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
-            >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
-              >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+            a test description
           </div>
         </div>
-      </div>
-    </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
-`;
-
-exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
-  >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string row"
               >
-                <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <input
-                    className="form-control"
-                    defaultValue="foo"
-                    disabled={false}
-                    id="root_foo-key"
-                    name="root_foo-key"
-                    onBlur={[Function]}
-                    required={false}
-                    type="text"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty-key"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="col-5"
-              >
-                <div>
-                  <input
-                    aria-describedby="root_foo__error root_foo__description root_foo__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_foo"
-                    name="root_foo"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="foo"
-                  />
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty
+                    </label>
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="form-control"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
+                    />
+                  </div>
                 </div>
-              </div>
-              <div
-                className="py-4 d-grid gap-2 col-2"
-              >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_foo__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
+                <div
+                  class="py-4 d-grid gap-2 col-2"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_additionalProperty__remove"
+                    title="Remove"
+                    type="button"
                   >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
-                    />
-                  </svg>
-                </button>
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="py-4 col-3 offset-9"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description with global label off additionalProperties 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string"
+              class="col-12"
             >
-              <div>
-                <input
-                  aria-describedby="root_a__error root_a__description root_a__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_a"
-                  name="root_a"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  type="text"
-                  value=""
-                />
+               
+              <div
+                class="rjsf-field rjsf-field-string row"
+              >
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_foo-key"
+                      name="root_foo-key"
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <input
+                      aria-describedby="root_foo__error root_foo__description root_foo__help"
+                      class="form-control"
+                      id="root_foo"
+                      name="root_foo"
+                      placeholder=""
+                      type="text"
+                      value="foo"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_foo__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
-        >
           <div
-            className="col-12"
+            class="row"
           >
-             
             <div
-              className="rjsf-field rjsf-field-number"
+              class="py-4 col-3 offset-9"
             >
-              <div>
-                <input
-                  aria-describedby="root_b__error root_b__description root_b__help"
-                  autoFocus={false}
-                  className="form-control"
-                  disabled={false}
-                  id="root_b"
-                  name="root_b"
-                  onBlur={[Function]}
-                  onChange={[Function]}
-                  onFocus={[Function]}
-                  placeholder=""
-                  readOnly={false}
-                  required={false}
-                  step="any"
-                  type="number"
-                  value=""
-                />
-              </div>
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
+              >
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
-exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+exports[`object fields with title and description with global label off object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
-    <div>
-      <div
-        className="p-0 container-fluid"
-      >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
         <div
-          className="row"
-          style={
-            {
-              "marginBottom": "10px",
-            }
-          }
+          class="p-0 container-fluid"
         >
           <div
-            className="col-12"
+            class="row"
+            style="margin-bottom: 10px;"
           >
-             
             <div
-              className="rjsf-field rjsf-field-string row"
+              class="col-12"
             >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-string"
               >
                 <div>
-                  <label
-                    className="form-label"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    additionalProperty Key
-                  </label>
                   <input
-                    className="form-control"
-                    defaultValue="additionalProperty"
-                    disabled={false}
-                    id="root_additionalProperty-key"
-                    name="root_additionalProperty-key"
-                    onBlur={[Function]}
-                    required={false}
+                    aria-describedby="root_a__error root_a__description root_a__help"
+                    class="form-control"
+                    id="root_a"
+                    name="root_a"
+                    placeholder=""
                     type="text"
+                    value=""
                   />
                 </div>
               </div>
+            </div>
+          </div>
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="col-5"
+                class="rjsf-field rjsf-field-number"
               >
                 <div>
                   <input
-                    aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                    autoFocus={false}
-                    className="form-control"
-                    disabled={false}
-                    id="root_additionalProperty"
-                    name="root_additionalProperty"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
+                    aria-describedby="root_b__error root_b__description root_b__help"
+                    class="form-control"
+                    id="root_b"
+                    name="root_b"
                     placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="should appear"
+                    step="any"
+                    type="number"
+                    value=""
                   />
                 </div>
               </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
+`;
+
+exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
+<DocumentFragment>
+  <form
+    class="rjsf"
+  >
+    <div
+      class="rjsf-field rjsf-field-object"
+    >
+      <div>
+        <div
+          class="p-0 container-fluid"
+        >
+          <div
+            class="row"
+            style="margin-bottom: 10px;"
+          >
+            <div
+              class="col-12"
+            >
+               
               <div
-                className="py-4 d-grid gap-2 col-2"
+                class="rjsf-field rjsf-field-string row"
               >
-                <button
-                  className="btn btn-danger btn-sm"
-                  disabled={false}
-                  id="root_additionalProperty__remove"
-                  onClick={[Function]}
-                  title="Remove"
-                  type="button"
+                <div
+                  class="col-5"
                 >
-                  <svg
-                    fill="currentColor"
-                    height="1em"
-                    stroke="currentColor"
-                    strokeWidth="0"
-                    style={
-                      {
-                        "color": undefined,
-                      }
-                    }
-                    viewBox="0 0 512 512"
-                    width="1em"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                  <div>
+                    <label
+                      class="form-label"
+                      for="root_additionalProperty-key"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <input
+                      class="form-control"
+                      id="root_additionalProperty-key"
+                      name="root_additionalProperty-key"
+                      type="text"
+                      value="additionalProperty"
+                    />
+                  </div>
+                </div>
+                <div
+                  class="col-5"
+                >
+                  <div>
+                    <input
+                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                      class="form-control"
+                      id="root_additionalProperty"
+                      name="root_additionalProperty"
+                      placeholder=""
+                      type="text"
+                      value="should appear"
                     />
-                  </svg>
-                </button>
+                  </div>
+                </div>
+                <div
+                  class="py-4 d-grid gap-2 col-2"
+                >
+                  <button
+                    class="btn btn-danger btn-sm"
+                    id="root_additionalProperty__remove"
+                    title="Remove"
+                    type="button"
+                  >
+                    <svg
+                      fill="currentColor"
+                      height="1em"
+                      stroke="currentColor"
+                      stroke-width="0"
+                      viewBox="0 0 512 512"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="M368.5 240h-225c-8.8 0-16 7.2-16 16 0 4.4 1.8 8.4 4.7 11.3 2.9 2.9 6.9 4.7 11.3 4.7h225c8.8 0 16-7.2 16-16s-7.2-16-16-16z"
+                      />
+                    </svg>
+                  </button>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className="row"
-        >
           <div
-            className="py-4 col-3 offset-9"
+            class="row"
           >
-            <button
-              className="ml-1 rjsf-object-property-expand btn btn-primary"
-              disabled={false}
-              id="root__add"
-              onClick={[Function]}
-              style={
-                {
-                  "width": "100%",
-                }
-              }
-              title="Add Item"
-              type="button"
+            <div
+              class="py-4 col-3 offset-9"
             >
-              <svg
-                fill="currentColor"
-                height="1em"
-                stroke="currentColor"
-                strokeWidth="0"
-                style={
-                  {
-                    "color": undefined,
-                  }
-                }
-                viewBox="0 0 16 16"
-                width="1em"
-                xmlns="http://www.w3.org/2000/svg"
+              <button
+                class="ml-1 rjsf-object-property-expand btn btn-primary"
+                id="root__add"
+                style="width: 100%;"
+                title="Add Item"
+                type="button"
               >
-                <path
-                  clipRule="evenodd"
-                  d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
-                  fillRule="evenodd"
-                />
-                <path
-                  clipRule="evenodd"
-                  d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
-                  fillRule="evenodd"
-                />
-              </svg>
-            </button>
+                <svg
+                  fill="currentColor"
+                  height="1em"
+                  stroke="currentColor"
+                  stroke-width="0"
+                  viewBox="0 0 16 16"
+                  width="1em"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    clip-rule="evenodd"
+                    d="M8 3.5a.5.5 0 01.5.5v4a.5.5 0 01-.5.5H4a.5.5 0 010-1h3.5V4a.5.5 0 01.5-.5z"
+                    fill-rule="evenodd"
+                  />
+                  <path
+                    clip-rule="evenodd"
+                    d="M7.5 8a.5.5 0 01.5-.5h4a.5.5 0 010 1H8.5V12a.5.5 0 01-1 0V8z"
+                    fill-rule="evenodd"
+                  />
+                </svg>
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="btn btn-primary"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="btn btn-primary"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap b/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
index ffaa4f12af..8b8d9a73b9 100644
--- a/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
@@ -1,177 +1,153 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-object"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-object"
         >
-          <h5
-            className="ui dividing header"
-            id="root_person__title"
-          >
-            person
-          </h5>
           <div
-            className="rjsf-field rjsf-field-string"
+            class="grouped equal width fields"
           >
+            <h5
+              class="ui dividing header"
+              id="root_person__title"
+            >
+              person
+            </h5>
             <div
-              className="grouped equal width fields"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                className="field"
+                class="grouped equal width fields"
               >
-                <label
-                  htmlFor="root_person_name"
-                >
-                  name
-                </label>
                 <div
-                  className="ui fluid input"
+                  class="field"
                 >
-                  <input
-                    aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                    autoFocus={false}
-                    disabled={false}
-                    id="root_person_name"
-                    name="root[person][name]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    for="root_person_name"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="ui fluid input"
+                  >
+                    <input
+                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                      id="root_person_name"
+                      name="root[person][name]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-object"
-          >
             <div
-              className="grouped equal width fields"
+              class="rjsf-field rjsf-field-object"
             >
-              <h5
-                className="ui dividing header"
-                id="root_person_address__title"
-              >
-                address
-              </h5>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="grouped equal width fields"
               >
+                <h5
+                  class="ui dividing header"
+                  id="root_person_address__title"
+                >
+                  address
+                </h5>
                 <div
-                  className="grouped equal width fields"
+                  class="rjsf-field rjsf-field-string"
                 >
                   <div
-                    className="field"
+                    class="grouped equal width fields"
                   >
-                    <label
-                      htmlFor="root_person_address_street"
-                    >
-                      street
-                    </label>
                     <div
-                      className="ui fluid input"
+                      class="field"
                     >
-                      <input
-                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                        autoFocus={false}
-                        disabled={false}
-                        id="root_person_address_street"
-                        name="root[person][address][street]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        required={false}
-                        type="text"
-                        value=""
-                      />
+                      <label
+                        for="root_person_address_street"
+                      >
+                        street
+                      </label>
+                      <div
+                        class="ui fluid input"
+                      >
+                        <input
+                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                          id="root_person_address_street"
+                          name="root[person][address][street]"
+                          placeholder=""
+                          type="text"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  className="grouped equal width fields"
+                  class="rjsf-field rjsf-field-string"
                 >
                   <div
-                    className="field"
+                    class="grouped equal width fields"
                   >
-                    <label
-                      htmlFor="root_person_address_city"
-                    >
-                      city
-                    </label>
                     <div
-                      className="ui fluid input"
+                      class="field"
                     >
-                      <input
-                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                        autoFocus={false}
-                        disabled={false}
-                        id="root_person_address_city"
-                        name="root[person][address][city]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        required={false}
-                        type="text"
-                        value=""
-                      />
+                      <label
+                        for="root_person_address_city"
+                      >
+                        city
+                      </label>
+                      <div
+                        class="ui fluid input"
+                      >
+                        <input
+                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                          id="root_person_address_city"
+                          name="root[person][address][city]"
+                          placeholder=""
+                          type="text"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  className="grouped equal width fields"
+                  class="rjsf-field rjsf-field-string"
                 >
                   <div
-                    className="field"
+                    class="grouped equal width fields"
                   >
-                    <label
-                      htmlFor="root_person_address_country"
-                    >
-                      country
-                    </label>
                     <div
-                      className="ui fluid input"
+                      class="field"
                     >
-                      <input
-                        aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                        autoFocus={false}
-                        disabled={false}
-                        id="root_person_address_country"
-                        name="root[person][address][country]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        required={false}
-                        type="text"
-                        value=""
-                      />
+                      <label
+                        for="root_person_address_country"
+                      >
+                        country
+                      </label>
+                      <div
+                        class="ui fluid input"
+                      >
+                        <input
+                          aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                          id="root_person_address_country"
+                          name="root[person][address][country]"
+                          placeholder=""
+                          type="text"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -181,852 +157,722 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_name"
-            >
-              name
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_name__error root_name__description root_name__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_name"
-                name="root[name]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value="John"
-              />
+              <label
+                for="root_name"
+              >
+                name
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  id="root_name"
+                  name="root[name]"
+                  placeholder=""
+                  type="text"
+                  value="John"
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_customField"
-                  >
-                    customField Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_customField"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="customField"
-                      disabled={false}
-                      id="root_customField"
-                      name="root_customField"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_customField"
+                    >
+                      customField Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_customField"
+                    >
+                      <input
+                        id="root_customField"
+                        name="root_customField"
+                        type="text"
+                        value="customField"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_customField"
-                  >
-                    customField
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_customField__error root_customField__description root_customField__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_customField"
-                      name="root[customField]"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="customValue"
-                    />
+                    <label
+                      for="root_customField"
+                    >
+                      customField
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_customField__error root_customField__description root_customField__help"
+                        id="root_customField"
+                        name="root[customField]"
+                        placeholder=""
+                        type="text"
+                        value="customValue"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_customField__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_customField__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_name"
-            >
-              name
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_name__error root_name__description root_name__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_name"
-                name="root[name]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value="Alice"
-              />
+              <label
+                for="root_name"
+              >
+                name
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  id="root_name"
+                  name="root[name]"
+                  placeholder=""
+                  type="text"
+                  value="Alice"
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_age"
-            >
-              age
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_age__error root_age__description root_age__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_age"
-                name="root[age]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value={30}
-              />
+              <label
+                for="root_age"
+              >
+                age
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  id="root_age"
+                  name="root[age]"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value="30"
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-boolean"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-boolean"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
             <div
-              className="ui checked checkbox"
-              inverted="false"
-              onBlur={[Function]}
-              onChange={[Function]}
-              onClick={[Function]}
-              onFocus={[Function]}
-              onMouseDown={[Function]}
-              onMouseUp={[Function]}
+              class="field"
             >
-              <input
-                aria-describedby="root_active__error root_active__description root_active__help"
-                autoFocus={false}
-                checked={true}
-                className="hidden"
-                disabled={false}
-                id="root_active"
-                name="root[active]"
-                readOnly={true}
-                required={false}
-                tabIndex={0}
-                type="checkbox"
-              />
-              <label
-                htmlFor="root_active"
+              <div
+                class="ui checked checkbox"
+                inverted="false"
               >
-                active
-              </label>
+                <input
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  checked=""
+                  class="hidden"
+                  id="root_active"
+                  name="root[active]"
+                  readonly=""
+                  tabindex="0"
+                  type="checkbox"
+                  value=""
+                />
+                <label
+                  for="root_active"
+                >
+                  active
+                </label>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-array"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-array"
         >
           <div
-            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+            class="grouped equal width fields"
           >
-            <h5
-              className="ui dividing header"
-              id="root_tags__title"
+            <div
+              class="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
             >
-              tags
-            </h5>
-            <div>
-              <div
-                className="row array-item-list"
+              <h5
+                class="ui dividing header"
+                id="root_tags__title"
               >
+                tags
+              </h5>
+              <div>
                 <div
-                  className="rjsf-array-item"
+                  class="row array-item-list"
                 >
                   <div
-                    className="ui grid"
-                    style={
-                      {
-                        "alignItems": "center",
-                        "display": "grid",
-                        "gridTemplateColumns": "1fr 150px",
-                      }
-                    }
+                    class="rjsf-array-item"
                   >
                     <div
-                      className="middle aligned sixteen wide column"
+                      class="ui grid"
+                      style="display: grid; grid-template-columns: 1fr 150px; align-items: center;"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="middle aligned sixteen wide column"
                       >
                         <div
-                          className="grouped equal width fields"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <div
-                            className="required field"
+                            class="grouped equal width fields"
                           >
-                            <label
-                              htmlFor="root_tags_0"
-                            >
-                              tags-0
-                            </label>
                             <div
-                              className="ui fluid input"
+                              class="required field"
                             >
-                              <input
-                                aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                autoFocus={false}
-                                disabled={false}
-                                id="root_tags_0"
-                                name="root[tags][0]"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="developer"
-                              />
+                              <label
+                                for="root_tags_0"
+                              >
+                                tags-0
+                              </label>
+                              <div
+                                class="ui fluid input"
+                              >
+                                <input
+                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                  id="root_tags_0"
+                                  name="root[tags][0]"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="developer"
+                                />
+                              </div>
                             </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="column"
-                    >
                       <div
-                        className="ui mini buttons"
+                        class="column"
                       >
-                        <button
-                          className="ui icon disabled button rjsf-array-item-move-up"
-                          disabled={true}
-                          id="root_tags_0__moveUp"
-                          onClick={[Function]}
-                          tabIndex={-1}
-                          title="Move up"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle up icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-move-down"
-                          id="root_tags_0__moveDown"
-                          onClick={[Function]}
-                          title="Move down"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle down icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-remove"
-                          id="root_tags_0__remove"
-                          onClick={[Function]}
-                          title="Remove"
+                        <div
+                          class="ui mini buttons"
                         >
-                          <i
-                            aria-hidden="true"
-                            className="trash icon"
-                            onClick={[Function]}
-                          />
-                        </button>
+                          <button
+                            class="ui icon disabled button rjsf-array-item-move-up"
+                            disabled=""
+                            id="root_tags_0__moveUp"
+                            tabindex="-1"
+                            title="Move up"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle up icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-move-down"
+                            id="root_tags_0__moveDown"
+                            title="Move down"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle down icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-remove"
+                            id="root_tags_0__remove"
+                            title="Remove"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="trash icon"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-array-item"
-                >
                   <div
-                    className="ui grid"
-                    style={
-                      {
-                        "alignItems": "center",
-                        "display": "grid",
-                        "gridTemplateColumns": "1fr 150px",
-                      }
-                    }
+                    class="rjsf-array-item"
                   >
                     <div
-                      className="middle aligned sixteen wide column"
+                      class="ui grid"
+                      style="display: grid; grid-template-columns: 1fr 150px; align-items: center;"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="middle aligned sixteen wide column"
                       >
                         <div
-                          className="grouped equal width fields"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <div
-                            className="required field"
+                            class="grouped equal width fields"
                           >
-                            <label
-                              htmlFor="root_tags_1"
-                            >
-                              tags-1
-                            </label>
                             <div
-                              className="ui fluid input"
+                              class="required field"
                             >
-                              <input
-                                aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                autoFocus={false}
-                                disabled={false}
-                                id="root_tags_1"
-                                name="root[tags][1]"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="designer"
-                              />
+                              <label
+                                for="root_tags_1"
+                              >
+                                tags-1
+                              </label>
+                              <div
+                                class="ui fluid input"
+                              >
+                                <input
+                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                  id="root_tags_1"
+                                  name="root[tags][1]"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="designer"
+                                />
+                              </div>
                             </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="column"
-                    >
                       <div
-                        className="ui mini buttons"
+                        class="column"
                       >
-                        <button
-                          className="ui icon button rjsf-array-item-move-up"
-                          id="root_tags_1__moveUp"
-                          onClick={[Function]}
-                          title="Move up"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle up icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon disabled button rjsf-array-item-move-down"
-                          disabled={true}
-                          id="root_tags_1__moveDown"
-                          onClick={[Function]}
-                          tabIndex={-1}
-                          title="Move down"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle down icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-remove"
-                          id="root_tags_1__remove"
-                          onClick={[Function]}
-                          title="Remove"
+                        <div
+                          class="ui mini buttons"
                         >
-                          <i
-                            aria-hidden="true"
-                            className="trash icon"
-                            onClick={[Function]}
-                          />
-                        </button>
+                          <button
+                            class="ui icon button rjsf-array-item-move-up"
+                            id="root_tags_1__moveUp"
+                            title="Move up"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle up icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon disabled button rjsf-array-item-move-down"
+                            disabled=""
+                            id="root_tags_1__moveDown"
+                            tabindex="-1"
+                            title="Move down"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle down icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-remove"
+                            id="root_tags_1__remove"
+                            title="Remove"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="trash icon"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
-              </div>
-              <div
-                style={
-                  {
-                    "marginTop": "1rem",
-                    "position": "relative",
-                    "textAlign": "right",
-                  }
-                }
-              >
-                <button
-                  className="ui tiny icon button rjsf-array-item-add"
-                  id="root_tags__add"
-                  onClick={[Function]}
-                  title="Add Item"
+                <div
+                  style="margin-top: 1rem; position: relative; text-align: right;"
                 >
-                  <i
-                    aria-hidden="true"
-                    className="plus icon"
-                    onClick={[Function]}
-                  />
-                </button>
+                  <button
+                    class="ui tiny icon button rjsf-array-item-add"
+                    id="root_tags__add"
+                    title="Add Item"
+                  >
+                    <i
+                      aria-hidden="true"
+                      class="plus icon"
+                    />
+                  </button>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_firstName"
-            >
-              firstName
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_firstName"
-                name="root[firstName]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_firstName"
+              >
+                firstName
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                  id="root_firstName"
+                  name="root[firstName]"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_lastName"
-            >
-              lastName
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_lastName"
-                name="root[lastName]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_lastName"
+              >
+                lastName
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                  id="root_lastName"
+                  name="root[lastName]"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_age"
-            >
-              age
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_age__error root_age__description root_age__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_age"
-                name="root[age]"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_age"
+              >
+                age
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  id="root_age"
+                  name="root[age]"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-object"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-object"
         >
-          <h5
-            className="ui dividing header"
-            id="root_person__title"
-          >
-            person
-          </h5>
           <div
-            className="rjsf-field rjsf-field-string"
+            class="grouped equal width fields"
           >
+            <h5
+              class="ui dividing header"
+              id="root_person__title"
+            >
+              person
+            </h5>
             <div
-              className="grouped equal width fields"
+              class="rjsf-field rjsf-field-string"
             >
               <div
-                className="field"
+                class="grouped equal width fields"
               >
-                <label
-                  htmlFor="root_person_name"
-                >
-                  name
-                </label>
                 <div
-                  className="ui fluid input"
+                  class="field"
                 >
-                  <input
-                    aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                    autoFocus={false}
-                    disabled={false}
-                    id="root_person_name"
-                    name="root.person.name"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    for="root_person_name"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="ui fluid input"
+                  >
+                    <input
+                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                      id="root_person_name"
+                      name="root.person.name"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
-          </div>
-          <div
-            className="rjsf-field rjsf-field-object"
-          >
             <div
-              className="grouped equal width fields"
+              class="rjsf-field rjsf-field-object"
             >
-              <h5
-                className="ui dividing header"
-                id="root_person_address__title"
-              >
-                address
-              </h5>
               <div
-                className="rjsf-field rjsf-field-string"
+                class="grouped equal width fields"
               >
+                <h5
+                  class="ui dividing header"
+                  id="root_person_address__title"
+                >
+                  address
+                </h5>
                 <div
-                  className="grouped equal width fields"
+                  class="rjsf-field rjsf-field-string"
                 >
                   <div
-                    className="field"
+                    class="grouped equal width fields"
                   >
-                    <label
-                      htmlFor="root_person_address_street"
-                    >
-                      street
-                    </label>
                     <div
-                      className="ui fluid input"
+                      class="field"
                     >
-                      <input
-                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                        autoFocus={false}
-                        disabled={false}
-                        id="root_person_address_street"
-                        name="root.person.address.street"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        required={false}
-                        type="text"
-                        value=""
-                      />
+                      <label
+                        for="root_person_address_street"
+                      >
+                        street
+                      </label>
+                      <div
+                        class="ui fluid input"
+                      >
+                        <input
+                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                          id="root_person_address_street"
+                          name="root.person.address.street"
+                          placeholder=""
+                          type="text"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
-              </div>
-              <div
-                className="rjsf-field rjsf-field-string"
-              >
                 <div
-                  className="grouped equal width fields"
+                  class="rjsf-field rjsf-field-string"
                 >
                   <div
-                    className="field"
+                    class="grouped equal width fields"
                   >
-                    <label
-                      htmlFor="root_person_address_city"
-                    >
-                      city
-                    </label>
                     <div
-                      className="ui fluid input"
+                      class="field"
                     >
-                      <input
-                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                        autoFocus={false}
-                        disabled={false}
-                        id="root_person_address_city"
-                        name="root.person.address.city"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        required={false}
-                        type="text"
-                        value=""
-                      />
+                      <label
+                        for="root_person_address_city"
+                      >
+                        city
+                      </label>
+                      <div
+                        class="ui fluid input"
+                      >
+                        <input
+                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                          id="root_person_address_city"
+                          name="root.person.address.city"
+                          placeholder=""
+                          type="text"
+                          value=""
+                        />
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -1036,2430 +882,2083 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_name"
-            >
-              name
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_name__error root_name__description root_name__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_name"
-                name="root.name"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value="Test"
-              />
+              <label
+                for="root_name"
+              >
+                name
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_name__error root_name__description root_name__help"
+                  id="root_name"
+                  name="root.name"
+                  placeholder=""
+                  type="text"
+                  value="Test"
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_count"
-            >
-              count
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_count__error root_count__description root_count__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_count"
-                name="root.count"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value={5}
-              />
+              <label
+                for="root_count"
+              >
+                count
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_count__error root_count__description root_count__help"
+                  id="root_count"
+                  name="root.count"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value="5"
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-array"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-array"
         >
           <div
-            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+            class="grouped equal width fields"
           >
-            <h5
-              className="ui dividing header"
-              id="root_items__title"
+            <div
+              class="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
             >
-              items
-            </h5>
-            <div>
-              <div
-                className="row array-item-list"
+              <h5
+                class="ui dividing header"
+                id="root_items__title"
               >
+                items
+              </h5>
+              <div>
                 <div
-                  className="rjsf-array-item"
+                  class="row array-item-list"
                 >
                   <div
-                    className="ui grid"
-                    style={
-                      {
-                        "alignItems": "center",
-                        "display": "grid",
-                        "gridTemplateColumns": "1fr 150px",
-                      }
-                    }
+                    class="rjsf-array-item"
                   >
                     <div
-                      className="middle aligned sixteen wide column"
+                      class="ui grid"
+                      style="display: grid; grid-template-columns: 1fr 150px; align-items: center;"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="middle aligned sixteen wide column"
                       >
                         <div
-                          className="grouped equal width fields"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <div
-                            className="required field"
+                            class="grouped equal width fields"
                           >
-                            <label
-                              htmlFor="root_items_0"
-                            >
-                              items-0
-                            </label>
                             <div
-                              className="ui fluid input"
+                              class="required field"
                             >
-                              <input
-                                aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                autoFocus={false}
-                                disabled={false}
-                                id="root_items_0"
-                                name="root.items.0"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="a"
-                              />
+                              <label
+                                for="root_items_0"
+                              >
+                                items-0
+                              </label>
+                              <div
+                                class="ui fluid input"
+                              >
+                                <input
+                                  aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                  id="root_items_0"
+                                  name="root.items.0"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="a"
+                                />
+                              </div>
                             </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="column"
-                    >
                       <div
-                        className="ui mini buttons"
+                        class="column"
                       >
-                        <button
-                          className="ui icon disabled button rjsf-array-item-move-up"
-                          disabled={true}
-                          id="root_items_0__moveUp"
-                          onClick={[Function]}
-                          tabIndex={-1}
-                          title="Move up"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle up icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-move-down"
-                          id="root_items_0__moveDown"
-                          onClick={[Function]}
-                          title="Move down"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle down icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-remove"
-                          id="root_items_0__remove"
-                          onClick={[Function]}
-                          title="Remove"
+                        <div
+                          class="ui mini buttons"
                         >
-                          <i
-                            aria-hidden="true"
-                            className="trash icon"
-                            onClick={[Function]}
-                          />
-                        </button>
+                          <button
+                            class="ui icon disabled button rjsf-array-item-move-up"
+                            disabled=""
+                            id="root_items_0__moveUp"
+                            tabindex="-1"
+                            title="Move up"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle up icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-move-down"
+                            id="root_items_0__moveDown"
+                            title="Move down"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle down icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-remove"
+                            id="root_items_0__remove"
+                            title="Remove"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="trash icon"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
-                </div>
-                <div
-                  className="rjsf-array-item"
-                >
                   <div
-                    className="ui grid"
-                    style={
-                      {
-                        "alignItems": "center",
-                        "display": "grid",
-                        "gridTemplateColumns": "1fr 150px",
-                      }
-                    }
+                    class="rjsf-array-item"
                   >
                     <div
-                      className="middle aligned sixteen wide column"
+                      class="ui grid"
+                      style="display: grid; grid-template-columns: 1fr 150px; align-items: center;"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="middle aligned sixteen wide column"
                       >
                         <div
-                          className="grouped equal width fields"
+                          class="rjsf-field rjsf-field-string"
                         >
                           <div
-                            className="required field"
+                            class="grouped equal width fields"
                           >
-                            <label
-                              htmlFor="root_items_1"
-                            >
-                              items-1
-                            </label>
                             <div
-                              className="ui fluid input"
+                              class="required field"
                             >
-                              <input
-                                aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                autoFocus={false}
-                                disabled={false}
-                                id="root_items_1"
-                                name="root.items.1"
-                                onBlur={[Function]}
-                                onChange={[Function]}
-                                onFocus={[Function]}
-                                placeholder=""
-                                required={true}
-                                type="text"
-                                value="b"
-                              />
+                              <label
+                                for="root_items_1"
+                              >
+                                items-1
+                              </label>
+                              <div
+                                class="ui fluid input"
+                              >
+                                <input
+                                  aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                  id="root_items_1"
+                                  name="root.items.1"
+                                  placeholder=""
+                                  required=""
+                                  type="text"
+                                  value="b"
+                                />
+                              </div>
                             </div>
                           </div>
                         </div>
                       </div>
-                    </div>
-                    <div
-                      className="column"
-                    >
                       <div
-                        className="ui mini buttons"
+                        class="column"
                       >
-                        <button
-                          className="ui icon button rjsf-array-item-move-up"
-                          id="root_items_1__moveUp"
-                          onClick={[Function]}
-                          title="Move up"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle up icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon disabled button rjsf-array-item-move-down"
-                          disabled={true}
-                          id="root_items_1__moveDown"
-                          onClick={[Function]}
-                          tabIndex={-1}
-                          title="Move down"
-                        >
-                          <i
-                            aria-hidden="true"
-                            className="angle down icon"
-                            onClick={[Function]}
-                          />
-                        </button>
-                        <button
-                          className="ui icon button rjsf-array-item-remove"
-                          id="root_items_1__remove"
-                          onClick={[Function]}
-                          title="Remove"
+                        <div
+                          class="ui mini buttons"
                         >
-                          <i
-                            aria-hidden="true"
-                            className="trash icon"
-                            onClick={[Function]}
-                          />
-                        </button>
+                          <button
+                            class="ui icon button rjsf-array-item-move-up"
+                            id="root_items_1__moveUp"
+                            title="Move up"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle up icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon disabled button rjsf-array-item-move-down"
+                            disabled=""
+                            id="root_items_1__moveDown"
+                            tabindex="-1"
+                            title="Move down"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="angle down icon"
+                            />
+                          </button>
+                          <button
+                            class="ui icon button rjsf-array-item-remove"
+                            id="root_items_1__remove"
+                            title="Remove"
+                          >
+                            <i
+                              aria-hidden="true"
+                              class="trash icon"
+                            />
+                          </button>
+                        </div>
                       </div>
                     </div>
                   </div>
                 </div>
-              </div>
-              <div
-                style={
-                  {
-                    "marginTop": "1rem",
-                    "position": "relative",
-                    "textAlign": "right",
-                  }
-                }
-              >
-                <button
-                  className="ui tiny icon button rjsf-array-item-add"
-                  id="root_items__add"
-                  onClick={[Function]}
-                  title="Add Item"
+                <div
+                  style="margin-top: 1rem; position: relative; text-align: right;"
                 >
-                  <i
-                    aria-hidden="true"
-                    className="plus icon"
-                    onClick={[Function]}
-                  />
-                </button>
+                  <button
+                    class="ui tiny icon button rjsf-array-item-add"
+                    id="root_items__add"
+                    title="Add Item"
+                  >
+                    <i
+                      aria-hidden="true"
+                      class="plus icon"
+                    />
+                  </button>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_firstName"
-            >
-              firstName
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_firstName"
-                name="root.firstName"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_firstName"
+              >
+                firstName
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                  id="root_firstName"
+                  name="root.firstName"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-string"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_lastName"
-            >
-              lastName
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_lastName"
-                name="root.lastName"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_lastName"
+              >
+                lastName
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                  id="root_lastName"
+                  name="root.lastName"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_age"
-            >
-              age
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_age__error root_age__description root_age__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_age"
-                name="root.age"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_age"
+              >
+                age
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_age__error root_age__description root_age__help"
+                  id="root_age"
+                  name="root.age"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_foo"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_foo"
+                    >
+                      <input
+                        id="root_foo"
+                        name="root_foo"
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="foo"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_foo__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_a"
-            >
-              A
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_a__error root_a__description root_a__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_a"
-                name="root_a"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_a"
+              >
+                A
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  id="root_a"
+                  name="root_a"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_b"
-            >
-              B
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_b__error root_b__description root_b__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_b"
-                name="root_b"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_b"
+              >
+                B
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  id="root_b"
+                  name="root_b"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_additionalProperty"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_additionalProperty"
+                    >
+                      <input
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        type="text"
+                        value="additionalProperty"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="should appear"
-                    />
-                  </div>
-                </div>
-              </div>
-            </div>
-            <div
-              className="column"
-            >
-              <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="column"
               >
-                <i
-                  aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
-                />
-              </button>
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
         <div
-          className="row"
+          class="middle aligned sixteen wide column"
         >
           <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
+            class="row"
           >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
+            <div
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
+              <button
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
+              >
+                <i
+                  aria-hidden="true"
+                  class="plus icon"
+                />
+              </button>
+            </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        Test field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a test description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          Test field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a test description
+        </p>
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_foo"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_foo"
+                    >
+                      <input
+                        id="root_foo"
+                        name="root_foo"
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="foo"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_foo__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        My Field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a fancier description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          My Field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a fancier description
+        </p>
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_foo"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_foo"
+                    >
+                      <input
+                        id="root_foo"
+                        name="root_foo"
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="foo"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_foo__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        My Field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a fancier description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          My Field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a fancier description
+        </p>
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_a"
-            >
-              My Item A
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_a__error root_a__description root_a__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_a"
-                name="root_a"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_a"
+              >
+                My Item A
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  id="root_a"
+                  name="root_a"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_a__description"
+            >
+              a fancier item A description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_a__description"
-          >
-            a fancier item A description
-          </p>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_b"
-            >
-              My Item B
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_b__error root_b__description root_b__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_b"
-                name="root_b"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_b"
+              >
+                My Item B
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  id="root_b"
+                  name="root_b"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_b__description"
+            >
+              a fancier item B description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_b__description"
-          >
-            a fancier item B description
-          </p>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        My Field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a fancier description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          My Field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a fancier description
+        </p>
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_foo"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_foo"
+                    >
+                      <input
+                        id="root_foo"
+                        name="root_foo"
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="foo"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_foo__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        My Field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a fancier description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          My Field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a fancier description
+        </p>
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_a"
-            >
-              My Item A
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_a__error root_a__description root_a__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_a"
-                name="root_a"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_a"
+              >
+                My Item A
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  id="root_a"
+                  name="root_a"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_a__description"
+            >
+              a fancier item A description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_a__description"
-          >
-            a fancier item A description
-          </p>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_b"
-            >
-              My Item B
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_b__error root_b__description root_b__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_b"
-                name="root_b"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_b"
+              >
+                My Item B
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  id="root_b"
+                  name="root_b"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_b__description"
+            >
+              a fancier item B description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_b__description"
-          >
-            a fancier item B description
-          </p>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        My Field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a fancier description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          My Field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a fancier description
+        </p>
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_additionalProperty"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_additionalProperty"
+                    >
+                      <input
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        type="text"
+                        value="additionalProperty"
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                class="middle aligned column form-additional"
+              >
+                <div
+                  class="grouped equal width fields"
+                >
+                  <div
+                    class="field"
+                  >
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="column"
               >
-                <div
-                  className="field"
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty
-                  </label>
-                  <div
-                    className="ui fluid input"
-                  >
-                    <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="should appear"
-                    />
-                  </div>
-                </div>
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
               </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        Test field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a test description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          Test field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a test description
+        </p>
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_a"
-            >
-              A
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_a__error root_a__description root_a__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_a"
-                name="root_a"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <label
+                for="root_a"
+              >
+                A
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  id="root_a"
+                  name="root_a"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_a__description"
+            >
+              A description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_a__description"
-          >
-            A description
-          </p>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
-            <label
-              htmlFor="root_b"
-            >
-              B
-            </label>
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_b__error root_b__description root_b__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_b"
-                name="root_b"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <label
+                for="root_b"
+              >
+                B
+              </label>
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  id="root_b"
+                  name="root_b"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
+            <p
+              class="sui-description"
+              id="root_b__description"
+            >
+              B description
+            </p>
           </div>
-          <p
-            className="sui-description"
-            id="root_b__description"
-          >
-            B description
-          </p>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
-      <h5
-        className="ui dividing header"
-        id="root__title"
-      >
-        Test field
-      </h5>
-      <p
-        className="sui-description"
-        id="root__description"
-      >
-        a test description
-      </p>
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
+        <h5
+          class="ui dividing header"
+          id="root__title"
+        >
+          Test field
+        </h5>
+        <p
+          class="sui-description"
+          id="root__description"
+        >
+          a test description
+        </p>
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_additionalProperty"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_additionalProperty"
+                    >
+                      <input
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        type="text"
+                        value="additionalProperty"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty
-                  </label>
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="should appear"
-                    />
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty
+                    </label>
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_foo"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_foo"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_foo"
+                    >
+                      foo Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_foo"
+                    >
+                      <input
+                        id="root_foo"
+                        name="root_foo"
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_foo__error root_foo__description root_foo__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_foo"
-                      name="root_foo"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="foo"
-                    />
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_foo__error root_foo__description root_foo__help"
+                        id="root_foo"
+                        name="root_foo"
+                        placeholder=""
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_foo__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_a__error root_a__description root_a__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_a"
-                name="root_a"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                type="text"
-                value=""
-              />
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_a__error root_a__description root_a__help"
+                  id="root_a"
+                  name="root_a"
+                  placeholder=""
+                  type="text"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
-      </div>
-      <div
-        className="rjsf-field rjsf-field-number"
-      >
         <div
-          className="grouped equal width fields"
+          class="rjsf-field rjsf-field-number"
         >
           <div
-            className="field"
+            class="grouped equal width fields"
           >
             <div
-              className="ui fluid input"
+              class="field"
             >
-              <input
-                aria-describedby="root_b__error root_b__description root_b__help"
-                autoFocus={false}
-                disabled={false}
-                id="root_b"
-                name="root_b"
-                onBlur={[Function]}
-                onChange={[Function]}
-                onFocus={[Function]}
-                placeholder=""
-                required={false}
-                step="any"
-                type="number"
-                value=""
-              />
+              <div
+                class="ui fluid input"
+              >
+                <input
+                  aria-describedby="root_b__error root_b__description root_b__help"
+                  id="root_b"
+                  name="root_b"
+                  placeholder=""
+                  step="any"
+                  type="number"
+                  value=""
+                />
+              </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="ui form rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="ui form rjsf"
   >
     <div
-      className="grouped equal width fields"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="rjsf-field rjsf-field-string"
+        class="grouped equal width fields"
       >
         <div
-          className="ui equal width grid"
+          class="rjsf-field rjsf-field-string"
         >
           <div
-            className="row"
+            class="ui equal width grid"
           >
             <div
-              className="column form-additional"
+              class="row"
             >
               <div
-                className="grouped equal width fields"
+                class="column form-additional"
               >
                 <div
-                  className="field form-group"
+                  class="grouped equal width fields"
                 >
-                  <label
-                    htmlFor="root_additionalProperty"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="ui fluid input"
-                    hasFeedback={true}
-                    htmlFor="root_additionalProperty"
+                    class="field form-group"
                   >
-                    <input
-                      aria-describedby={null}
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      required={false}
-                      type="text"
-                    />
+                    <label
+                      for="root_additionalProperty"
+                    >
+                      additionalProperty Key
+                    </label>
+                    <div
+                      class="ui fluid input"
+                      for="root_additionalProperty"
+                    >
+                      <input
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        type="text"
+                        value="additionalProperty"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
-            </div>
-            <div
-              className="middle aligned column form-additional"
-            >
               <div
-                className="grouped equal width fields"
+                class="middle aligned column form-additional"
               >
                 <div
-                  className="field"
+                  class="grouped equal width fields"
                 >
                   <div
-                    className="ui fluid input"
+                    class="field"
                   >
-                    <input
-                      aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                      autoFocus={false}
-                      disabled={false}
-                      id="root_additionalProperty"
-                      name="root_additionalProperty"
-                      onBlur={[Function]}
-                      onChange={[Function]}
-                      onFocus={[Function]}
-                      placeholder=""
-                      required={false}
-                      type="text"
-                      value="should appear"
-                    />
+                    <div
+                      class="ui fluid input"
+                    >
+                      <input
+                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                        id="root_additionalProperty"
+                        name="root_additionalProperty"
+                        placeholder=""
+                        type="text"
+                        value="should appear"
+                      />
+                    </div>
                   </div>
                 </div>
               </div>
+              <div
+                class="column"
+              >
+                <button
+                  class="ui mini icon button rjsf-object-property-remove"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                >
+                  <i
+                    aria-hidden="true"
+                    class="trash icon"
+                  />
+                </button>
+              </div>
             </div>
+          </div>
+        </div>
+        <div
+          class="middle aligned sixteen wide column"
+        >
+          <div
+            class="row"
+          >
             <div
-              className="column"
+              style="margin-top: 1rem; position: relative; text-align: right;"
             >
               <button
-                className="ui mini icon button rjsf-object-property-remove"
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
+                class="ui tiny icon button rjsf-object-property-expand"
+                id="root__add"
+                title="Add Item"
               >
                 <i
                   aria-hidden="true"
-                  className="trash icon"
-                  onClick={[Function]}
+                  class="plus icon"
                 />
               </button>
             </div>
           </div>
         </div>
       </div>
-      <div
-        className="middle aligned sixteen wide column"
-      >
-        <div
-          className="row"
-        >
-          <div
-            style={
-              {
-                "marginTop": "1rem",
-                "position": "relative",
-                "textAlign": "right",
-              }
-            }
-          >
-            <button
-              className="ui tiny icon button rjsf-object-property-expand"
-              id="root__add"
-              onClick={[Function]}
-              title="Add Item"
-            >
-              <i
-                aria-hidden="true"
-                className="plus icon"
-                onClick={[Function]}
-              />
-            </button>
-          </div>
-        </div>
-      </div>
     </div>
-  </div>
-  <button
-    className="ui primary button"
-    onClick={[Function]}
-    type="submit"
-  >
-    Submit
-  </button>
-</form>
+    <button
+      class="ui primary button"
+      type="submit"
+    >
+      Submit
+    </button>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/shadcn/test/__snapshots__/Object.test.tsx.snap b/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
index 1c544f5af7..972a57efe0 100644
--- a/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
@@ -1,257 +1,221 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
 exports[`nameGenerator bracketNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-object"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-object"
               >
                 <div
-                  className="my-1 flex flex-col gap-0.5"
-                  id="root_person__title"
+                  class="flex flex-col gap-2"
                 >
-                  <h5>
-                    person
-                  </h5>
                   <div
-                    className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                    data-orientation="horizontal"
-                    data-slot="separator"
-                    dir="horizontal"
-                    role="none"
-                    style={
-                      {
-                        "height": "1px",
-                      }
-                    }
-                  />
-                </div>
-                <div
-                  className="flex flex-col gap-2"
-                >
+                    class="my-1 flex flex-col gap-0.5"
+                    id="root_person__title"
+                  >
+                    <h5>
+                      person
+                    </h5>
+                    <div
+                      class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                      data-orientation="horizontal"
+                      data-slot="separator"
+                      dir="horizontal"
+                      role="none"
+                      style="height: 1px;"
+                    />
+                  </div>
                   <div
-                    className=" flex"
+                    class="flex flex-col gap-2"
                   >
                     <div
-                      className="w-full"
+                      class=" flex"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="w-full"
                       >
                         <div
-                          className="flex flex-col gap-2"
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                            htmlFor="root_person_name"
-                          >
-                            name
-                          </label>
                           <div
-                            className="p-0.5"
+                            class="flex flex-col gap-2"
                           >
-                            <input
-                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                              autoFocus={false}
-                              className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                              data-slot="input"
-                              disabled={false}
-                              id="root_person_name"
-                              name="root[person][name]"
-                              onBlur={[Function]}
-                              onChange={[Function]}
-                              onFocus={[Function]}
-                              placeholder=""
-                              readOnly={false}
-                              required={false}
-                              type="text"
-                              value=""
-                            />
+                            <label
+                              class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                              for="root_person_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              class="p-0.5"
+                            >
+                              <input
+                                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                data-slot="input"
+                                id="root_person_name"
+                                name="root[person][name]"
+                                placeholder=""
+                                type="text"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className=" flex"
-                  >
                     <div
-                      className="w-full"
+                      class=" flex"
                     >
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class="w-full"
                       >
                         <div
-                          className="flex flex-col gap-2"
+                          class="rjsf-field rjsf-field-object"
                         >
                           <div
-                            className="my-1 flex flex-col gap-0.5"
-                            id="root_person_address__title"
+                            class="flex flex-col gap-2"
                           >
-                            <h5>
-                              address
-                            </h5>
                             <div
-                              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                              data-orientation="horizontal"
-                              data-slot="separator"
-                              dir="horizontal"
-                              role="none"
-                              style={
-                                {
-                                  "height": "1px",
-                                }
-                              }
-                            />
-                          </div>
-                          <div
-                            className="flex flex-col gap-2"
-                          >
+                              class="my-1 flex flex-col gap-0.5"
+                              id="root_person_address__title"
+                            >
+                              <h5>
+                                address
+                              </h5>
+                              <div
+                                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                                data-orientation="horizontal"
+                                data-slot="separator"
+                                dir="horizontal"
+                                role="none"
+                                style="height: 1px;"
+                              />
+                            </div>
                             <div
-                              className=" flex"
+                              class="flex flex-col gap-2"
                             >
                               <div
-                                className="w-full"
+                                class=" flex"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="w-full"
                                 >
                                   <div
-                                    className="flex flex-col gap-2"
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      street
-                                    </label>
                                     <div
-                                      className="p-0.5"
+                                      class="flex flex-col gap-2"
                                     >
-                                      <input
-                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                        autoFocus={false}
-                                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                        data-slot="input"
-                                        disabled={false}
-                                        id="root_person_address_street"
-                                        name="root[person][address][street]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        readOnly={false}
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
+                                      <label
+                                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                        for="root_person_address_street"
+                                      >
+                                        street
+                                      </label>
+                                      <div
+                                        class="p-0.5"
+                                      >
+                                        <input
+                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                          data-slot="input"
+                                          id="root_person_address_street"
+                                          name="root[person][address][street]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className=" flex"
-                            >
                               <div
-                                className="w-full"
+                                class=" flex"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="w-full"
                                 >
                                   <div
-                                    className="flex flex-col gap-2"
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      city
-                                    </label>
                                     <div
-                                      className="p-0.5"
+                                      class="flex flex-col gap-2"
                                     >
-                                      <input
-                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                        autoFocus={false}
-                                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                        data-slot="input"
-                                        disabled={false}
-                                        id="root_person_address_city"
-                                        name="root[person][address][city]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        readOnly={false}
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
+                                      <label
+                                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                        for="root_person_address_city"
+                                      >
+                                        city
+                                      </label>
+                                      <div
+                                        class="p-0.5"
+                                      >
+                                        <input
+                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                          data-slot="input"
+                                          id="root_person_address_city"
+                                          name="root[person][address][city]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className=" flex"
-                            >
                               <div
-                                className="w-full"
+                                class=" flex"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="w-full"
                                 >
                                   <div
-                                    className="flex flex-col gap-2"
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                      htmlFor="root_person_address_country"
-                                    >
-                                      country
-                                    </label>
                                     <div
-                                      className="p-0.5"
+                                      class="flex flex-col gap-2"
                                     >
-                                      <input
-                                        aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
-                                        autoFocus={false}
-                                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                        data-slot="input"
-                                        disabled={false}
-                                        id="root_person_address_country"
-                                        name="root[person][address][country]"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        readOnly={false}
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
+                                      <label
+                                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                        for="root_person_address_country"
+                                      >
+                                        country
+                                      </label>
+                                      <div
+                                        class="p-0.5"
+                                      >
+                                        <input
+                                          aria-describedby="root_person_address_country__error root_person_address_country__description root_person_address_country__help"
+                                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                          data-slot="input"
+                                          id="root_person_address_country"
+                                          name="root[person][address][country]"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
@@ -269,832 +233,742 @@ exports[`nameGenerator bracketNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
-        >
-          <div
-            className="w-full"
-          >
-            <div
-              className="rjsf-field rjsf-field-string"
-            >
-              <div
-                className="flex flex-col gap-2"
-              >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
-                <div
-                  className="p-0.5"
-                >
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="John"
-                  />
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-        <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
+                  class="flex flex-col gap-2"
                 >
                   <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_customField-key"
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_name"
                   >
-                    customField Key
+                    name
                   </label>
                   <div
-                    className="pl-0.5"
+                    class="p-0.5"
                   >
                     <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
                       data-slot="input"
-                      defaultValue="customField"
-                      disabled={false}
-                      id="root_customField-key"
-                      name="root_customField-key"
-                      onBlur={[Function]}
-                      required={false}
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
                       type="text"
+                      value="John"
                     />
                   </div>
                 </div>
+              </div>
+            </div>
+          </div>
+          <div
+            class=" flex"
+          >
+            <div
+              class="w-full"
+            >
+              <div
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              >
                 <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_customField"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_customField-key"
                     >
-                      customField
+                      customField Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_customField__error root_customField__description root_customField__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_customField"
-                        name="root[customField]"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_customField-key"
+                        name="root_customField-key"
                         type="text"
-                        value="customValue"
+                        value="customField"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_customField"
+                      >
+                        customField
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_customField__error root_customField__description root_customField__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_customField"
+                          name="root[customField]"
+                          placeholder=""
+                          type="text"
+                          value="customValue"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_customField__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_customField__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_name"
-                    name="root[name]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="Alice"
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_name"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_name"
+                      name="root[name]"
+                      placeholder=""
+                      type="text"
+                      value="Alice"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={30}
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="30"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-boolean"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-boolean"
               >
                 <div
-                  aria-describedby="root_active__error root_active__description root_active__help"
-                  className="relative "
+                  class="flex flex-col gap-2"
                 >
                   <div
-                    className="flex items-center gap-2 my-2"
+                    aria-describedby="root_active__error root_active__description root_active__help"
+                    class="relative "
                   >
-                    <button
-                      aria-checked={true}
-                      aria-required={false}
-                      autoFocus={false}
-                      className="peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
-                      data-slot="checkbox"
-                      data-state="checked"
-                      disabled={false}
-                      id="root_active"
-                      onBlur={[Function]}
-                      onClick={[Function]}
-                      onFocus={[Function]}
-                      onKeyDown={[Function]}
-                      role="checkbox"
-                      type="button"
-                      value="on"
+                    <div
+                      class="flex items-center gap-2 my-2"
                     >
-                      <span
-                        className="flex items-center justify-center text-current transition-none"
-                        data-slot="checkbox-indicator"
+                      <button
+                        aria-checked="true"
+                        aria-required="false"
+                        class="peer border-input dark:bg-input/30 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground dark:data-[state=checked]:bg-primary data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
+                        data-slot="checkbox"
                         data-state="checked"
-                        style={
-                          {
-                            "pointerEvents": "none",
-                          }
-                        }
+                        id="root_active"
+                        role="checkbox"
+                        type="button"
+                        value="on"
                       >
-                        <svg
-                          className="size-3.5"
-                          fill="none"
-                          height="15"
-                          viewBox="0 0 15 15"
-                          width="15"
-                          xmlns="http://www.w3.org/2000/svg"
+                        <span
+                          class="flex items-center justify-center text-current transition-none"
+                          data-slot="checkbox-indicator"
+                          data-state="checked"
+                          style="pointer-events: none;"
                         >
-                          <path
-                            clipRule="evenodd"
-                            d="M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z"
-                            fill="currentColor"
-                            fillRule="evenodd"
-                          />
-                        </svg>
-                      </span>
-                    </button>
-                    <input
-                      aria-hidden={true}
-                      defaultChecked={true}
-                      disabled={false}
-                      name="root[active]"
-                      required={false}
-                      style={
-                        {
-                          "margin": 0,
-                          "opacity": 0,
-                          "pointerEvents": "none",
-                          "position": "absolute",
-                          "transform": "translateX(-100%)",
-                        }
-                      }
-                      tabIndex={-1}
-                      type="checkbox"
-                      value="on"
-                    />
-                    <label
-                      className="flex items-center gap-2 text-sm font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50 leading-tight"
-                      data-slot="label"
-                      htmlFor="root_active"
-                      onMouseDown={[Function]}
-                    >
-                      active
-                    </label>
+                          <svg
+                            class="size-3.5"
+                            fill="none"
+                            height="15"
+                            viewBox="0 0 15 15"
+                            width="15"
+                            xmlns="http://www.w3.org/2000/svg"
+                          >
+                            <path
+                              clip-rule="evenodd"
+                              d="M11.4669 3.72684C11.7558 3.91574 11.8369 4.30308 11.648 4.59198L7.39799 11.092C7.29783 11.2452 7.13556 11.3467 6.95402 11.3699C6.77247 11.3931 6.58989 11.3355 6.45446 11.2124L3.70446 8.71241C3.44905 8.48022 3.43023 8.08494 3.66242 7.82953C3.89461 7.57412 4.28989 7.55529 4.5453 7.78749L6.75292 9.79441L10.6018 3.90792C10.7907 3.61902 11.178 3.53795 11.4669 3.72684Z"
+                              fill="currentColor"
+                              fill-rule="evenodd"
+                            />
+                          </svg>
+                        </span>
+                      </button>
+                      <input
+                        aria-hidden="true"
+                        checked=""
+                        name="root[active]"
+                        style="position: absolute; pointer-events: none; opacity: 0; margin: 0px; transform: translateX(-100%); width: 0px; height: 0px;"
+                        tabindex="-1"
+                        type="checkbox"
+                        value="on"
+                      />
+                      <label
+                        class="flex items-center gap-2 text-sm font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50 leading-tight"
+                        data-slot="label"
+                        for="root_active"
+                      >
+                        active
+                      </label>
+                    </div>
                   </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-array"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-array"
               >
-                <div>
-                  <div
-                    className="m-0 flex p-0"
-                  >
+                <div
+                  class="flex flex-col gap-2"
+                >
+                  <div>
                     <div
-                      className="m-0 w-full p-0"
+                      class="m-0 flex p-0"
                     >
                       <div
-                        className="my-1 flex flex-col gap-0.5"
-                        id="root_tags__title"
+                        class="m-0 w-full p-0"
                       >
-                        <h5>
-                          tags
-                        </h5>
                         <div
-                          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                          data-orientation="horizontal"
-                          data-slot="separator"
-                          dir="horizontal"
-                          role="none"
-                          style={
-                            {
-                              "height": "1px",
-                            }
-                          }
-                        />
-                      </div>
-                      <div
-                        className="p-0 m-0 w-full mb-2"
-                      >
-                        <div>
+                          class="my-1 flex flex-col gap-0.5"
+                          id="root_tags__title"
+                        >
+                          <h5>
+                            tags
+                          </h5>
                           <div
-                            className="mb-2 flex flex-row flex-wrap items-center"
-                          >
+                            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                            data-orientation="horizontal"
+                            data-slot="separator"
+                            dir="horizontal"
+                            role="none"
+                            style="height: 1px;"
+                          />
+                        </div>
+                        <div
+                          class="p-0 m-0 w-full mb-2"
+                        >
+                          <div>
                             <div
-                              className="grow shrink"
+                              class="mb-2 flex flex-row flex-wrap items-center"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="grow shrink"
                               >
                                 <div
-                                  className="flex flex-col gap-2"
+                                  class="rjsf-field rjsf-field-string"
                                 >
-                                  <label
-                                    className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                    htmlFor="root_tags_0"
-                                  >
-                                    tags-1
-                                    *
-                                  </label>
                                   <div
-                                    className="p-0.5"
+                                    class="flex flex-col gap-2"
                                   >
-                                    <input
-                                      aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
-                                      autoFocus={false}
-                                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                      data-slot="input"
-                                      disabled={false}
-                                      id="root_tags_0"
-                                      name="root[tags][0]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={true}
-                                      type="text"
-                                      value="developer"
-                                    />
+                                    <label
+                                      class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                      for="root_tags_0"
+                                    >
+                                      tags-1*
+                                    </label>
+                                    <div
+                                      class="p-0.5"
+                                    >
+                                      <input
+                                        aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                        data-slot="input"
+                                        id="root_tags_0"
+                                        name="root[tags][0]"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="developer"
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="flex items-end justify-end p-0.5"
-                            >
                               <div
-                                className="flex gap-2"
+                                class="flex items-end justify-end p-0.5"
                               >
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
-                                  data-slot="button"
-                                  disabled={true}
-                                  id="root_tags_0__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="flex gap-2"
                                 >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-up h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
+                                    data-slot="button"
+                                    disabled=""
+                                    id="root_tags_0__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m18 15-6-6-6 6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_tags_0__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-down h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-up h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m18 15-6-6-6 6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
+                                    data-slot="button"
+                                    id="root_tags_0__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m6 9 6 6 6-6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_tags_0__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-down h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m6 9 6 6 6-6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                                    data-slot="button"
+                                    id="root_tags_0__remove"
+                                    title="Remove"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M10 11v6"
-                                    />
-                                    <path
-                                      d="M14 11v6"
-                                    />
-                                    <path
-                                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                                    />
-                                    <path
-                                      d="M3 6h18"
-                                    />
-                                    <path
-                                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 11v6"
+                                      />
+                                      <path
+                                        d="M14 11v6"
+                                      />
+                                      <path
+                                        d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                                      />
+                                      <path
+                                        d="M3 6h18"
+                                      />
+                                      <path
+                                        d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            className="mb-2 flex flex-row flex-wrap items-center"
-                          >
+                          <div>
                             <div
-                              className="grow shrink"
+                              class="mb-2 flex flex-row flex-wrap items-center"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="grow shrink"
                               >
                                 <div
-                                  className="flex flex-col gap-2"
+                                  class="rjsf-field rjsf-field-string"
                                 >
-                                  <label
-                                    className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                    htmlFor="root_tags_1"
-                                  >
-                                    tags-2
-                                    *
-                                  </label>
                                   <div
-                                    className="p-0.5"
+                                    class="flex flex-col gap-2"
                                   >
-                                    <input
-                                      aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
-                                      autoFocus={false}
-                                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                      data-slot="input"
-                                      disabled={false}
-                                      id="root_tags_1"
-                                      name="root[tags][1]"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={true}
-                                      type="text"
-                                      value="designer"
-                                    />
+                                    <label
+                                      class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                      for="root_tags_1"
+                                    >
+                                      tags-2*
+                                    </label>
+                                    <div
+                                      class="p-0.5"
+                                    >
+                                      <input
+                                        aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                        data-slot="input"
+                                        id="root_tags_1"
+                                        name="root[tags][1]"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="designer"
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="flex items-end justify-end p-0.5"
-                            >
                               <div
-                                className="flex gap-2"
+                                class="flex items-end justify-end p-0.5"
                               >
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_tags_1__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="flex gap-2"
                                 >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-up h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
+                                    data-slot="button"
+                                    id="root_tags_1__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m18 15-6-6-6 6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
-                                  data-slot="button"
-                                  disabled={true}
-                                  id="root_tags_1__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-down h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-up h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m18 15-6-6-6 6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
+                                    data-slot="button"
+                                    disabled=""
+                                    id="root_tags_1__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m6 9 6 6 6-6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_tags_1__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-down h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m6 9 6 6 6-6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                                    data-slot="button"
+                                    id="root_tags_1__remove"
+                                    title="Remove"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M10 11v6"
-                                    />
-                                    <path
-                                      d="M14 11v6"
-                                    />
-                                    <path
-                                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                                    />
-                                    <path
-                                      d="M3 6h18"
-                                    />
-                                    <path
-                                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 11v6"
+                                      />
+                                      <path
+                                        d="M14 11v6"
+                                      />
+                                      <path
+                                        d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                                      />
+                                      <path
+                                        d="M3 6h18"
+                                      />
+                                      <path
+                                        d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="mt-2 flex"
-                        >
                           <div
-                            className="p-0 m-0"
+                            class="mt-2 flex"
                           >
-                            <button
-                              className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-array-item-add"
-                              data-slot="button"
-                              disabled={false}
-                              id="root_tags__add"
-                              onClick={[Function]}
-                              type="button"
+                            <div
+                              class="p-0 m-0"
                             >
-                              <svg
-                                aria-hidden="true"
-                                className="lucide lucide-circle-plus"
-                                fill="none"
-                                height={16}
-                                stroke="currentColor"
-                                strokeLinecap="round"
-                                strokeLinejoin="round"
-                                strokeWidth={2}
-                                viewBox="0 0 24 24"
-                                width={16}
-                                xmlns="http://www.w3.org/2000/svg"
+                              <button
+                                class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-array-item-add"
+                                data-slot="button"
+                                id="root_tags__add"
+                                type="button"
                               >
-                                <circle
-                                  cx="12"
-                                  cy="12"
-                                  r="10"
-                                />
-                                <path
-                                  d="M8 12h8"
-                                />
-                                <path
-                                  d="M12 8v8"
-                                />
-                              </svg>
-                               
-                              Add Item
-                            </button>
+                                <svg
+                                  aria-hidden="true"
+                                  class="lucide lucide-circle-plus"
+                                  fill="none"
+                                  height="16"
+                                  stroke="currentColor"
+                                  stroke-linecap="round"
+                                  stroke-linejoin="round"
+                                  stroke-width="2"
+                                  viewBox="0 0 24 24"
+                                  width="16"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <circle
+                                    cx="12"
+                                    cy="12"
+                                    r="10"
+                                  />
+                                  <path
+                                    d="M8 12h8"
+                                  />
+                                  <path
+                                    d="M12 8v8"
+                                  />
+                                </svg>
+                                 Add Item
+                              </button>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -1107,160 +981,138 @@ exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator bracketNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_firstName"
-                >
-                  firstName
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root[firstName]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_firstName"
+                  >
+                    firstName
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_firstName"
+                      name="root[firstName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_lastName"
-                >
-                  lastName
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root[lastName]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_lastName"
+                  >
+                    lastName
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_lastName"
+                      name="root[lastName]"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_age"
-                    name="root[age]"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_age"
+                      name="root[age]"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -1268,229 +1120,199 @@ exports[`nameGenerator bracketNameGenerator simple object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-object"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-object"
               >
                 <div
-                  className="my-1 flex flex-col gap-0.5"
-                  id="root_person__title"
+                  class="flex flex-col gap-2"
                 >
-                  <h5>
-                    person
-                  </h5>
                   <div
-                    className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                    data-orientation="horizontal"
-                    data-slot="separator"
-                    dir="horizontal"
-                    role="none"
-                    style={
-                      {
-                        "height": "1px",
-                      }
-                    }
-                  />
-                </div>
-                <div
-                  className="flex flex-col gap-2"
-                >
+                    class="my-1 flex flex-col gap-0.5"
+                    id="root_person__title"
+                  >
+                    <h5>
+                      person
+                    </h5>
+                    <div
+                      class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                      data-orientation="horizontal"
+                      data-slot="separator"
+                      dir="horizontal"
+                      role="none"
+                      style="height: 1px;"
+                    />
+                  </div>
                   <div
-                    className=" flex"
+                    class="flex flex-col gap-2"
                   >
                     <div
-                      className="w-full"
+                      class=" flex"
                     >
                       <div
-                        className="rjsf-field rjsf-field-string"
+                        class="w-full"
                       >
                         <div
-                          className="flex flex-col gap-2"
+                          class="rjsf-field rjsf-field-string"
                         >
-                          <label
-                            className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                            htmlFor="root_person_name"
-                          >
-                            name
-                          </label>
                           <div
-                            className="p-0.5"
+                            class="flex flex-col gap-2"
                           >
-                            <input
-                              aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
-                              autoFocus={false}
-                              className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                              data-slot="input"
-                              disabled={false}
-                              id="root_person_name"
-                              name="root.person.name"
-                              onBlur={[Function]}
-                              onChange={[Function]}
-                              onFocus={[Function]}
-                              placeholder=""
-                              readOnly={false}
-                              required={false}
-                              type="text"
-                              value=""
-                            />
+                            <label
+                              class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                              for="root_person_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              class="p-0.5"
+                            >
+                              <input
+                                aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                data-slot="input"
+                                id="root_person_name"
+                                name="root.person.name"
+                                placeholder=""
+                                type="text"
+                                value=""
+                              />
+                            </div>
                           </div>
                         </div>
                       </div>
                     </div>
-                  </div>
-                  <div
-                    className=" flex"
-                  >
                     <div
-                      className="w-full"
+                      class=" flex"
                     >
                       <div
-                        className="rjsf-field rjsf-field-object"
+                        class="w-full"
                       >
                         <div
-                          className="flex flex-col gap-2"
+                          class="rjsf-field rjsf-field-object"
                         >
                           <div
-                            className="my-1 flex flex-col gap-0.5"
-                            id="root_person_address__title"
+                            class="flex flex-col gap-2"
                           >
-                            <h5>
-                              address
-                            </h5>
                             <div
-                              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                              data-orientation="horizontal"
-                              data-slot="separator"
-                              dir="horizontal"
-                              role="none"
-                              style={
-                                {
-                                  "height": "1px",
-                                }
-                              }
-                            />
-                          </div>
-                          <div
-                            className="flex flex-col gap-2"
-                          >
+                              class="my-1 flex flex-col gap-0.5"
+                              id="root_person_address__title"
+                            >
+                              <h5>
+                                address
+                              </h5>
+                              <div
+                                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                                data-orientation="horizontal"
+                                data-slot="separator"
+                                dir="horizontal"
+                                role="none"
+                                style="height: 1px;"
+                              />
+                            </div>
                             <div
-                              className=" flex"
+                              class="flex flex-col gap-2"
                             >
                               <div
-                                className="w-full"
+                                class=" flex"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="w-full"
                                 >
                                   <div
-                                    className="flex flex-col gap-2"
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                      htmlFor="root_person_address_street"
-                                    >
-                                      street
-                                    </label>
                                     <div
-                                      className="p-0.5"
+                                      class="flex flex-col gap-2"
                                     >
-                                      <input
-                                        aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
-                                        autoFocus={false}
-                                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                        data-slot="input"
-                                        disabled={false}
-                                        id="root_person_address_street"
-                                        name="root.person.address.street"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        readOnly={false}
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
+                                      <label
+                                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                        for="root_person_address_street"
+                                      >
+                                        street
+                                      </label>
+                                      <div
+                                        class="p-0.5"
+                                      >
+                                        <input
+                                          aria-describedby="root_person_address_street__error root_person_address_street__description root_person_address_street__help"
+                                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                          data-slot="input"
+                                          id="root_person_address_street"
+                                          name="root.person.address.street"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className=" flex"
-                            >
                               <div
-                                className="w-full"
+                                class=" flex"
                               >
                                 <div
-                                  className="rjsf-field rjsf-field-string"
+                                  class="w-full"
                                 >
                                   <div
-                                    className="flex flex-col gap-2"
+                                    class="rjsf-field rjsf-field-string"
                                   >
-                                    <label
-                                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                      htmlFor="root_person_address_city"
-                                    >
-                                      city
-                                    </label>
                                     <div
-                                      className="p-0.5"
+                                      class="flex flex-col gap-2"
                                     >
-                                      <input
-                                        aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
-                                        autoFocus={false}
-                                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                        data-slot="input"
-                                        disabled={false}
-                                        id="root_person_address_city"
-                                        name="root.person.address.city"
-                                        onBlur={[Function]}
-                                        onChange={[Function]}
-                                        onFocus={[Function]}
-                                        placeholder=""
-                                        readOnly={false}
-                                        required={false}
-                                        type="text"
-                                        value=""
-                                      />
+                                      <label
+                                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                        for="root_person_address_city"
+                                      >
+                                        city
+                                      </label>
+                                      <div
+                                        class="p-0.5"
+                                      >
+                                        <input
+                                          aria-describedby="root_person_address_city__error root_person_address_city__description root_person_address_city__help"
+                                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                          data-slot="input"
+                                          id="root_person_address_city"
+                                          name="root.person.address.city"
+                                          placeholder=""
+                                          type="text"
+                                          value=""
+                                        />
+                                      </div>
                                     </div>
                                   </div>
                                 </div>
@@ -1508,500 +1330,454 @@ exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_name"
-                >
-                  name
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_name__error root_name__description root_name__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_name"
-                    name="root.name"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value="Test"
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_name"
+                  >
+                    name
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_name__error root_name__description root_name__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_name"
+                      name="root.name"
+                      placeholder=""
+                      type="text"
+                      value="Test"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_count"
-                >
-                  count
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_count__error root_count__description root_count__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_count"
-                    name="root.count"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value={5}
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_count"
+                  >
+                    count
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_count__error root_count__description root_count__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_count"
+                      name="root.count"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value="5"
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-array"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-array"
               >
-                <div>
-                  <div
-                    className="m-0 flex p-0"
-                  >
+                <div
+                  class="flex flex-col gap-2"
+                >
+                  <div>
                     <div
-                      className="m-0 w-full p-0"
+                      class="m-0 flex p-0"
                     >
                       <div
-                        className="my-1 flex flex-col gap-0.5"
-                        id="root_items__title"
+                        class="m-0 w-full p-0"
                       >
-                        <h5>
-                          items
-                        </h5>
                         <div
-                          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-                          data-orientation="horizontal"
-                          data-slot="separator"
-                          dir="horizontal"
-                          role="none"
-                          style={
-                            {
-                              "height": "1px",
-                            }
-                          }
-                        />
-                      </div>
-                      <div
-                        className="p-0 m-0 w-full mb-2"
-                      >
-                        <div>
+                          class="my-1 flex flex-col gap-0.5"
+                          id="root_items__title"
+                        >
+                          <h5>
+                            items
+                          </h5>
                           <div
-                            className="mb-2 flex flex-row flex-wrap items-center"
-                          >
+                            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+                            data-orientation="horizontal"
+                            data-slot="separator"
+                            dir="horizontal"
+                            role="none"
+                            style="height: 1px;"
+                          />
+                        </div>
+                        <div
+                          class="p-0 m-0 w-full mb-2"
+                        >
+                          <div>
                             <div
-                              className="grow shrink"
+                              class="mb-2 flex flex-row flex-wrap items-center"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="grow shrink"
                               >
                                 <div
-                                  className="flex flex-col gap-2"
+                                  class="rjsf-field rjsf-field-string"
                                 >
-                                  <label
-                                    className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                    htmlFor="root_items_0"
-                                  >
-                                    items-1
-                                    *
-                                  </label>
                                   <div
-                                    className="p-0.5"
+                                    class="flex flex-col gap-2"
                                   >
-                                    <input
-                                      aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
-                                      autoFocus={false}
-                                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                      data-slot="input"
-                                      disabled={false}
-                                      id="root_items_0"
-                                      name="root.items.0"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={true}
-                                      type="text"
-                                      value="a"
-                                    />
+                                    <label
+                                      class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                      for="root_items_0"
+                                    >
+                                      items-1*
+                                    </label>
+                                    <div
+                                      class="p-0.5"
+                                    >
+                                      <input
+                                        aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                        data-slot="input"
+                                        id="root_items_0"
+                                        name="root.items.0"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="a"
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="flex items-end justify-end p-0.5"
-                            >
                               <div
-                                className="flex gap-2"
+                                class="flex items-end justify-end p-0.5"
                               >
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
-                                  data-slot="button"
-                                  disabled={true}
-                                  id="root_items_0__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="flex gap-2"
                                 >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-up h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
+                                    data-slot="button"
+                                    disabled=""
+                                    id="root_items_0__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m18 15-6-6-6 6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_items_0__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-down h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-up h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m18 15-6-6-6 6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
+                                    data-slot="button"
+                                    id="root_items_0__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m6 9 6 6 6-6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_items_0__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-down h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m6 9 6 6 6-6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                                    data-slot="button"
+                                    id="root_items_0__remove"
+                                    title="Remove"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M10 11v6"
-                                    />
-                                    <path
-                                      d="M14 11v6"
-                                    />
-                                    <path
-                                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                                    />
-                                    <path
-                                      d="M3 6h18"
-                                    />
-                                    <path
-                                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 11v6"
+                                      />
+                                      <path
+                                        d="M14 11v6"
+                                      />
+                                      <path
+                                        d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                                      />
+                                      <path
+                                        d="M3 6h18"
+                                      />
+                                      <path
+                                        d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div>
-                          <div
-                            className="mb-2 flex flex-row flex-wrap items-center"
-                          >
+                          <div>
                             <div
-                              className="grow shrink"
+                              class="mb-2 flex flex-row flex-wrap items-center"
                             >
                               <div
-                                className="rjsf-field rjsf-field-string"
+                                class="grow shrink"
                               >
                                 <div
-                                  className="flex flex-col gap-2"
+                                  class="rjsf-field rjsf-field-string"
                                 >
-                                  <label
-                                    className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                                    htmlFor="root_items_1"
-                                  >
-                                    items-2
-                                    *
-                                  </label>
                                   <div
-                                    className="p-0.5"
+                                    class="flex flex-col gap-2"
                                   >
-                                    <input
-                                      aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
-                                      autoFocus={false}
-                                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                                      data-slot="input"
-                                      disabled={false}
-                                      id="root_items_1"
-                                      name="root.items.1"
-                                      onBlur={[Function]}
-                                      onChange={[Function]}
-                                      onFocus={[Function]}
-                                      placeholder=""
-                                      readOnly={false}
-                                      required={true}
-                                      type="text"
-                                      value="b"
-                                    />
+                                    <label
+                                      class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                                      for="root_items_1"
+                                    >
+                                      items-2*
+                                    </label>
+                                    <div
+                                      class="p-0.5"
+                                    >
+                                      <input
+                                        aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                                        data-slot="input"
+                                        id="root_items_1"
+                                        name="root.items.1"
+                                        placeholder=""
+                                        required=""
+                                        type="text"
+                                        value="b"
+                                      />
+                                    </div>
                                   </div>
                                 </div>
                               </div>
-                            </div>
-                            <div
-                              className="flex items-end justify-end p-0.5"
-                            >
                               <div
-                                className="flex gap-2"
+                                class="flex items-end justify-end p-0.5"
                               >
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_items_1__moveUp"
-                                  onClick={[Function]}
-                                  title="Move up"
-                                  type="button"
+                                <div
+                                  class="flex gap-2"
                                 >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-up h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-up"
+                                    data-slot="button"
+                                    id="root_items_1__moveUp"
+                                    title="Move up"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m18 15-6-6-6 6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
-                                  data-slot="button"
-                                  disabled={true}
-                                  id="root_items_1__moveDown"
-                                  onClick={[Function]}
-                                  title="Move down"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-chevron-down h-4 w-4"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-up h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m18 15-6-6-6 6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 rjsf-array-item-move-down"
+                                    data-slot="button"
+                                    disabled=""
+                                    id="root_items_1__moveDown"
+                                    title="Move down"
+                                    type="button"
                                   >
-                                    <path
-                                      d="m6 9 6 6 6-6"
-                                    />
-                                  </svg>
-                                </button>
-                                <button
-                                  className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                                  data-slot="button"
-                                  disabled={false}
-                                  id="root_items_1__remove"
-                                  onClick={[Function]}
-                                  title="Remove"
-                                  type="button"
-                                >
-                                  <svg
-                                    aria-hidden="true"
-                                    className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                                    fill="none"
-                                    height={24}
-                                    stroke="currentColor"
-                                    strokeLinecap="round"
-                                    strokeLinejoin="round"
-                                    strokeWidth={2}
-                                    viewBox="0 0 24 24"
-                                    width={24}
-                                    xmlns="http://www.w3.org/2000/svg"
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-chevron-down h-4 w-4"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="m6 9 6 6 6-6"
+                                      />
+                                    </svg>
+                                  </button>
+                                  <button
+                                    class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                                    data-slot="button"
+                                    id="root_items_1__remove"
+                                    title="Remove"
+                                    type="button"
                                   >
-                                    <path
-                                      d="M10 11v6"
-                                    />
-                                    <path
-                                      d="M14 11v6"
-                                    />
-                                    <path
-                                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                                    />
-                                    <path
-                                      d="M3 6h18"
-                                    />
-                                    <path
-                                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                                    />
-                                  </svg>
-                                </button>
+                                    <svg
+                                      aria-hidden="true"
+                                      class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                                      fill="none"
+                                      height="24"
+                                      stroke="currentColor"
+                                      stroke-linecap="round"
+                                      stroke-linejoin="round"
+                                      stroke-width="2"
+                                      viewBox="0 0 24 24"
+                                      width="24"
+                                      xmlns="http://www.w3.org/2000/svg"
+                                    >
+                                      <path
+                                        d="M10 11v6"
+                                      />
+                                      <path
+                                        d="M14 11v6"
+                                      />
+                                      <path
+                                        d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                                      />
+                                      <path
+                                        d="M3 6h18"
+                                      />
+                                      <path
+                                        d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                                      />
+                                    </svg>
+                                  </button>
+                                </div>
                               </div>
                             </div>
                           </div>
-                        </div>
-                        <div
-                          className="mt-2 flex"
-                        >
                           <div
-                            className="p-0 m-0"
+                            class="mt-2 flex"
                           >
-                            <button
-                              className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-array-item-add"
-                              data-slot="button"
-                              disabled={false}
-                              id="root_items__add"
-                              onClick={[Function]}
-                              type="button"
+                            <div
+                              class="p-0 m-0"
                             >
-                              <svg
-                                aria-hidden="true"
-                                className="lucide lucide-circle-plus"
-                                fill="none"
-                                height={16}
-                                stroke="currentColor"
-                                strokeLinecap="round"
-                                strokeLinejoin="round"
-                                strokeWidth={2}
-                                viewBox="0 0 24 24"
-                                width={16}
-                                xmlns="http://www.w3.org/2000/svg"
+                              <button
+                                class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-array-item-add"
+                                data-slot="button"
+                                id="root_items__add"
+                                type="button"
                               >
-                                <circle
-                                  cx="12"
-                                  cy="12"
-                                  r="10"
-                                />
-                                <path
-                                  d="M8 12h8"
-                                />
-                                <path
-                                  d="M12 8v8"
-                                />
-                              </svg>
-                               
-                              Add Item
-                            </button>
+                                <svg
+                                  aria-hidden="true"
+                                  class="lucide lucide-circle-plus"
+                                  fill="none"
+                                  height="16"
+                                  stroke="currentColor"
+                                  stroke-linecap="round"
+                                  stroke-linejoin="round"
+                                  stroke-width="2"
+                                  viewBox="0 0 24 24"
+                                  width="16"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <circle
+                                    cx="12"
+                                    cy="12"
+                                    r="10"
+                                  />
+                                  <path
+                                    d="M8 12h8"
+                                  />
+                                  <path
+                                    d="M12 8v8"
+                                  />
+                                </svg>
+                                 Add Item
+                              </button>
+                            </div>
                           </div>
                         </div>
                       </div>
@@ -2014,160 +1790,138 @@ exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_firstName"
-                >
-                  firstName
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_firstName"
-                    name="root.firstName"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_firstName"
+                  >
+                    firstName
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_firstName"
+                      name="root.firstName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_lastName"
-                >
-                  lastName
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_lastName"
-                    name="root.lastName"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_lastName"
+                  >
+                    lastName
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_lastName"
+                      name="root.lastName"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_age"
-                >
-                  age
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_age__error root_age__description root_age__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_age"
-                    name="root.age"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_age"
+                  >
+                    age
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_age"
+                      name="root.age"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -2175,310 +1929,279 @@ exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
-                >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo-key"
-                      name="root_foo-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_foo"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_foo-key"
                     >
-                      foo
+                      foo Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_foo"
-                        name="root_foo"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_foo-key"
+                        name="root_foo-key"
                         type="text"
                         value="foo"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_foo"
+                      >
+                        foo
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_foo"
+                          name="root_foo"
+                          placeholder=""
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_foo__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
-            </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
-          </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
+            </div>
+          </div>
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_a"
-                >
-                  A
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_a"
+                  >
+                    A
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_b"
-                >
-                  B
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_b"
+                  >
+                    B
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -2486,2100 +2209,1896 @@ exports[`object fields object 1`] = `
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty-key"
-                      name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
-                >
-                  <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_additionalProperty"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_additionalProperty-key"
                     >
-                      additionalProperty
+                      additionalProperty Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_additionalProperty"
-                        name="root_additionalProperty"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_additionalProperty-key"
+                        name="root_additionalProperty-key"
                         type="text"
-                        value="should appear"
+                        value="additionalProperty"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_additionalProperty"
+                      >
+                        additionalProperty
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_additionalProperty"
+                          name="root_additionalProperty"
+                          placeholder=""
+                          type="text"
+                          value="should appear"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          Test field
-        </h5>
         <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
-        <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a test description
+          <h5>
+            Test field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a test description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
-                >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo-key"
-                      name="root_foo-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_foo"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_foo-key"
                     >
-                      foo
+                      foo Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_foo"
-                        name="root_foo"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_foo-key"
+                        name="root_foo-key"
                         type="text"
                         value="foo"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_foo"
+                      >
+                        foo
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_foo"
+                          name="root_foo"
+                          placeholder=""
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_foo__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          My Field
-        </h5>
-        <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
         <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo-key"
-                      name="root_foo-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
-                >
-                  <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_foo"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_foo-key"
                     >
-                      foo
+                      foo Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_foo"
-                        name="root_foo"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_foo-key"
+                        name="root_foo-key"
                         type="text"
                         value="foo"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_foo"
+                      >
+                        foo
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_foo"
+                          name="root_foo"
+                          placeholder=""
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_foo__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from both object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          My Field
-        </h5>
         <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
-        <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_a"
-                >
-                  My Item A
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
-                >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_a__description"
-                    >
-                      a fancier item A description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_a"
+                  >
+                    My Item A
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_a__description"
+                      >
+                        a fancier item A description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_b"
-                >
-                  My Item B
-                </label>
                 <div
-                  className="p-0.5"
-                >
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
+                  class="flex flex-col gap-2"
                 >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_b__description"
-                    >
-                      a fancier item B description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_b"
+                  >
+                    My Item B
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_b__description"
+                      >
+                        a fancier item B description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          My Field
-        </h5>
-        <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
         <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
                   <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo-key"
-                      name="root_foo-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
-                >
-                  <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_foo"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_foo-key"
                     >
-                      foo
+                      foo Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_foo"
-                        name="root_foo"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_foo-key"
+                        name="root_foo-key"
                         type="text"
                         value="foo"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_foo"
+                      >
+                        foo
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_foo"
+                          name="root_foo"
+                          placeholder=""
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_foo__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          My Field
-        </h5>
         <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
-        <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_a"
-                >
-                  My Item A
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
-                >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_a__description"
-                    >
-                      a fancier item A description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_a"
+                  >
+                    My Item A
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_a__description"
+                      >
+                        a fancier item A description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_b"
-                >
-                  My Item B
-                </label>
                 <div
-                  className="p-0.5"
-                >
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
+                  class="flex flex-col gap-2"
                 >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_b__description"
-                    >
-                      a fancier item B description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_b"
+                  >
+                    My Item B
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_b__description"
+                      >
+                        a fancier item B description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description from uiSchema show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          My Field
-        </h5>
-        <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
         <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a fancier description
+          <h5>
+            My Field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a fancier description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    additionalProperty Key
-                  </label>
                   <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty-key"
-                      name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
-                >
-                  <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_additionalProperty"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_additionalProperty-key"
                     >
-                      additionalProperty
+                      additionalProperty Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_additionalProperty"
-                        name="root_additionalProperty"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_additionalProperty-key"
+                        name="root_additionalProperty-key"
                         type="text"
-                        value="should appear"
+                        value="additionalProperty"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_additionalProperty"
+                      >
+                        additionalProperty
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_additionalProperty"
+                          name="root_additionalProperty"
+                          placeholder=""
+                          type="text"
+                          value="should appear"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
               </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
-                >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          Test field
-        </h5>
         <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
-        <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a test description
+          <h5>
+            Test field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a test description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_a"
-                >
-                  A
-                </label>
                 <div
-                  className="p-0.5"
-                >
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
+                  class="flex flex-col gap-2"
                 >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_a__description"
-                    >
-                      A description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_a"
+                  >
+                    A
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_a__description"
+                      >
+                        A description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
-                <label
-                  className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                  htmlFor="root_b"
-                >
-                  B
-                </label>
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
-                </div>
-                <span
-                  className="text-xs font-medium text-muted-foreground"
-                >
-                  <div>
-                    <div
-                      className="text-sm text-muted-foreground"
-                      id="root_b__description"
-                    >
-                      B description
-                    </div>
+                  <label
+                    class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                    for="root_b"
+                  >
+                    B
+                  </label>
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
                   </div>
-                </span>
+                  <span
+                    class="text-xs font-medium text-muted-foreground"
+                  >
+                    <div>
+                      <div
+                        class="text-sm text-muted-foreground"
+                        id="root_b__description"
+                      >
+                        B description
+                      </div>
+                    </div>
+                  </span>
+                </div>
               </div>
             </div>
           </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="my-1 flex flex-col gap-0.5"
-        id="root__title"
+        class="flex flex-col gap-2"
       >
-        <h5>
-          Test field
-        </h5>
-        <div
-          className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
-          data-orientation="horizontal"
-          data-slot="separator"
-          dir="horizontal"
-          role="none"
-          style={
-            {
-              "height": "1px",
-            }
-          }
-        />
-      </div>
-      <div>
         <div
-          className="text-sm text-muted-foreground"
-          id="root__description"
+          class="my-1 flex flex-col gap-0.5"
+          id="root__title"
         >
-          a test description
+          <h5>
+            Test field
+          </h5>
+          <div
+            class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px my-1"
+            data-orientation="horizontal"
+            data-slot="separator"
+            dir="horizontal"
+            role="none"
+            style="height: 1px;"
+          />
+        </div>
+        <div>
+          <div
+            class="text-sm text-muted-foreground"
+            id="root__description"
+          >
+            a test description
+          </div>
         </div>
-      </div>
-      <div
-        className="flex flex-col gap-2"
-      >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
-                >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    additionalProperty Key
-                  </label>
-                  <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty-key"
-                      name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
                     <label
-                      className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
-                      htmlFor="root_additionalProperty"
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_additionalProperty-key"
                     >
-                      additionalProperty
+                      additionalProperty Key
                     </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_additionalProperty"
-                        name="root_additionalProperty"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_additionalProperty-key"
+                        name="root_additionalProperty-key"
                         type="text"
-                        value="should appear"
+                        value="additionalProperty"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <label
+                        class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+                        for="root_additionalProperty"
+                      >
+                        additionalProperty
+                      </label>
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_additionalProperty"
+                          name="root_additionalProperty"
+                          placeholder=""
+                          type="text"
+                          value="should appear"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off additionalProperties 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
-                >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_foo-key"
-                  >
-                    foo Key
-                  </label>
-                  <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="foo"
-                      disabled={false}
-                      id="root_foo-key"
-                      name="root_foo-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
+                    <label
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_foo-key"
+                    >
+                      foo Key
+                    </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_foo__error root_foo__description root_foo__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_foo"
-                        name="root_foo"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_foo-key"
+                        name="root_foo-key"
                         type="text"
                         value="foo"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_foo__error root_foo__description root_foo__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_foo"
+                          name="root_foo"
+                          placeholder=""
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_foo__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_foo__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-string"
               >
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_a__error root_a__description root_a__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_a"
-                    name="root_a"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    type="text"
-                    value=""
-                  />
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_a__error root_a__description root_a__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_a"
+                      name="root_a"
+                      placeholder=""
+                      type="text"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
           </div>
-        </div>
-        <div
-          className=" flex"
-        >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="rjsf-field rjsf-field-number"
+              class="w-full"
             >
               <div
-                className="flex flex-col gap-2"
+                class="rjsf-field rjsf-field-number"
               >
                 <div
-                  className="p-0.5"
+                  class="flex flex-col gap-2"
                 >
-                  <input
-                    aria-describedby="root_b__error root_b__description root_b__help"
-                    autoFocus={false}
-                    className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
-                    data-slot="input"
-                    disabled={false}
-                    id="root_b"
-                    name="root_b"
-                    onBlur={[Function]}
-                    onChange={[Function]}
-                    onFocus={[Function]}
-                    placeholder=""
-                    readOnly={false}
-                    required={false}
-                    step="any"
-                    type="number"
-                    value=""
-                  />
+                  <div
+                    class="p-0.5"
+                  >
+                    <input
+                      aria-describedby="root_b__error root_b__description root_b__help"
+                      class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                      data-slot="input"
+                      id="root_b"
+                      name="root_b"
+                      placeholder=""
+                      step="any"
+                      type="number"
+                      value=""
+                    />
+                  </div>
                 </div>
               </div>
             </div>
@@ -4587,203 +4106,186 @@ exports[`object fields with title and description with global label off object 1
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
 
 exports[`object fields with title and description with global label off show add button and fields if additionalProperties is true and not an object 1`] = `
-<form
-  className="rjsf"
-  noValidate={false}
-  onSubmit={[Function]}
->
-  <div
-    className="rjsf-field rjsf-field-object"
+<DocumentFragment>
+  <form
+    class="rjsf"
   >
     <div
-      className="flex flex-col gap-2"
+      class="rjsf-field rjsf-field-object"
     >
       <div
-        className="flex flex-col gap-2"
+        class="flex flex-col gap-2"
       >
         <div
-          className=" flex"
+          class="flex flex-col gap-2"
         >
           <div
-            className="w-full"
+            class=" flex"
           >
             <div
-              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+              class="w-full"
             >
               <div
-                className="flex flex-col w-full gap-2 line-clamp-1"
+                class="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
               >
                 <div
-                  className="flex-grow"
-                >
-                  <label
-                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
-                    htmlFor="root_additionalProperty-key"
-                  >
-                    additionalProperty Key
-                  </label>
-                  <div
-                    className="pl-0.5"
-                  >
-                    <input
-                      className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
-                      data-slot="input"
-                      defaultValue="additionalProperty"
-                      disabled={false}
-                      id="root_additionalProperty-key"
-                      name="root_additionalProperty-key"
-                      onBlur={[Function]}
-                      required={false}
-                      type="text"
-                    />
-                  </div>
-                </div>
-                <div
-                  className="flex-grow pr-0.5"
+                  class="flex flex-col w-full gap-2 line-clamp-1"
                 >
                   <div
-                    className="flex flex-col gap-2"
+                    class="flex-grow"
                   >
+                    <label
+                      class="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                      for="root_additionalProperty-key"
+                    >
+                      additionalProperty Key
+                    </label>
                     <div
-                      className="p-0.5"
+                      class="pl-0.5"
                     >
                       <input
-                        aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
-                        autoFocus={false}
-                        className="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                        class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 min-w-0 rounded-md bg-transparent px-3 py-1 text-base transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive mt-1 w-full border shadow-sm"
                         data-slot="input"
-                        disabled={false}
-                        id="root_additionalProperty"
-                        name="root_additionalProperty"
-                        onBlur={[Function]}
-                        onChange={[Function]}
-                        onFocus={[Function]}
-                        placeholder=""
-                        readOnly={false}
-                        required={false}
+                        id="root_additionalProperty-key"
+                        name="root_additionalProperty-key"
                         type="text"
-                        value="should appear"
+                        value="additionalProperty"
                       />
                     </div>
                   </div>
+                  <div
+                    class="flex-grow pr-0.5"
+                  >
+                    <div
+                      class="flex flex-col gap-2"
+                    >
+                      <div
+                        class="p-0.5"
+                      >
+                        <input
+                          aria-describedby="root_additionalProperty__error root_additionalProperty__description root_additionalProperty__help"
+                          class="file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive"
+                          data-slot="input"
+                          id="root_additionalProperty"
+                          name="root_additionalProperty"
+                          placeholder=""
+                          type="text"
+                          value="should appear"
+                        />
+                      </div>
+                    </div>
+                  </div>
                 </div>
-              </div>
-              <button
-                className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
-                data-slot="button"
-                disabled={false}
-                id="root_additionalProperty__remove"
-                onClick={[Function]}
-                title="Remove"
-                type="button"
-              >
-                <svg
-                  aria-hidden="true"
-                  className="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
-                  fill="none"
-                  height={24}
-                  stroke="currentColor"
-                  strokeLinecap="round"
-                  strokeLinejoin="round"
-                  strokeWidth={2}
-                  viewBox="0 0 24 24"
-                  width={24}
-                  xmlns="http://www.w3.org/2000/svg"
+                <button
+                  class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 size-9 border-destructive"
+                  data-slot="button"
+                  id="root_additionalProperty__remove"
+                  title="Remove"
+                  type="button"
                 >
-                  <path
-                    d="M10 11v6"
-                  />
-                  <path
-                    d="M14 11v6"
-                  />
-                  <path
-                    d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
-                  />
-                  <path
-                    d="M3 6h18"
-                  />
-                  <path
-                    d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
-                  />
-                </svg>
-              </button>
+                  <svg
+                    aria-hidden="true"
+                    class="lucide lucide-trash2 lucide-trash-2 h-4 w-4 stroke-destructive"
+                    fill="none"
+                    height="24"
+                    stroke="currentColor"
+                    stroke-linecap="round"
+                    stroke-linejoin="round"
+                    stroke-width="2"
+                    viewBox="0 0 24 24"
+                    width="24"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <path
+                      d="M10 11v6"
+                    />
+                    <path
+                      d="M14 11v6"
+                    />
+                    <path
+                      d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6"
+                    />
+                    <path
+                      d="M3 6h18"
+                    />
+                    <path
+                      d="M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"
+                    />
+                  </svg>
+                </button>
+              </div>
+              <div
+                class="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
+                data-orientation="horizontal"
+                data-slot="separator"
+                dir="horizontal"
+                role="none"
+              />
             </div>
-            <div
-              className="bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px mt-2"
-              data-orientation="horizontal"
-              data-slot="separator"
-              dir="horizontal"
-              role="none"
-            />
           </div>
-        </div>
-        <div
-          className="p-0 m-0"
-        >
-          <button
-            className="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
-            data-slot="button"
-            disabled={false}
-            id="root__add"
-            onClick={[Function]}
-            type="button"
+          <div
+            class="p-0 m-0"
           >
-            <svg
-              aria-hidden="true"
-              className="lucide lucide-circle-plus"
-              fill="none"
-              height={16}
-              stroke="currentColor"
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              strokeWidth={2}
-              viewBox="0 0 24 24"
-              width={16}
-              xmlns="http://www.w3.org/2000/svg"
+            <button
+              class="inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50 h-9 px-4 py-2 has-[>svg]:px-3 w-fit gap-2 rjsf-object-property-expand"
+              data-slot="button"
+              id="root__add"
+              type="button"
             >
-              <circle
-                cx="12"
-                cy="12"
-                r="10"
-              />
-              <path
-                d="M8 12h8"
-              />
-              <path
-                d="M12 8v8"
-              />
-            </svg>
-             
-            Add Item
-          </button>
+              <svg
+                aria-hidden="true"
+                class="lucide lucide-circle-plus"
+                fill="none"
+                height="16"
+                stroke="currentColor"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                stroke-width="2"
+                viewBox="0 0 24 24"
+                width="16"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <circle
+                  cx="12"
+                  cy="12"
+                  r="10"
+                />
+                <path
+                  d="M8 12h8"
+                />
+                <path
+                  d="M12 8v8"
+                />
+              </svg>
+               Add Item
+            </button>
+          </div>
         </div>
       </div>
     </div>
-  </div>
-  <div>
-    <button
-      className="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
-      data-slot="button"
-      disabled={false}
-      type="submit"
-    >
-      Submit
-    </button>
-  </div>
-</form>
+    <div>
+      <button
+        class="inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive bg-primary text-primary-foreground shadow-xs hover:bg-primary/90 h-9 px-4 py-2 has-[>svg]:px-3 my-2"
+        data-slot="button"
+        type="submit"
+      >
+        Submit
+      </button>
+    </div>
+  </form>
+</DocumentFragment>
 `;
diff --git a/packages/snapshot-tests/src/objectTests.tsx b/packages/snapshot-tests/src/objectTests.tsx
index 63e0811e6e..0c00c99bc0 100644
--- a/packages/snapshot-tests/src/objectTests.tsx
+++ b/packages/snapshot-tests/src/objectTests.tsx
@@ -1,5 +1,5 @@
 import { ComponentType } from 'react';
-import renderer from 'react-test-renderer';
+import { render } from '@testing-library/react';
 import { FormProps } from '@rjsf/core';
 import { RJSFSchema, UiSchema, bracketNameGenerator, dotNotationNameGenerator } from '@rjsf/utils';
 import validator from '@rjsf/validator-ajv8';
@@ -40,7 +40,7 @@ const labelsOff: UiSchema = {
 
 export function objectTests(Form: ComponentType<FormProps>) {
   describe('object fields', () => {
-    test('object', () => {
+    test('object', async () => {
       const schema: RJSFSchema = {
         type: 'object',
         properties: {
@@ -48,29 +48,29 @@ export function objectTests(Form: ComponentType<FormProps>) {
           b: { type: 'number', title: 'B' },
         },
       };
-      const tree = renderer.create(<Form schema={schema} validator={validator} />).toJSON();
-      expect(tree).toMatchSnapshot();
+      const { asFragment } = render(<Form schema={schema} validator={validator} />);
+      expect(asFragment()).toMatchSnapshot();
     });
-    test('additionalProperties', () => {
+    test('additionalProperties', async () => {
       const schema: RJSFSchema = {
         type: 'object',
         additionalProperties: true,
       };
-      const tree = renderer.create(<Form schema={schema} validator={validator} formData={{ foo: 'foo' }} />).toJSON();
-      expect(tree).toMatchSnapshot();
+      const { asFragment } = render(<Form schema={schema} validator={validator} formData={{ foo: 'foo' }} />);
+      expect(asFragment()).toMatchSnapshot();
     });
-    test('show add button and fields if additionalProperties is true and not an object', () => {
+    test('show add button and fields if additionalProperties is true and not an object', async () => {
       const schema: RJSFSchema = {
         additionalProperties: true,
       };
       const formData: any = {
         additionalProperty: 'should appear',
       };
-      const tree = renderer.create(<Form schema={schema} validator={validator} formData={formData} />).toJSON();
-      expect(tree).toMatchSnapshot();
+      const { asFragment } = render(<Form schema={schema} validator={validator} formData={formData} />);
+      expect(asFragment()).toMatchSnapshot();
     });
     describe('with title and description', () => {
-      test('object', () => {
+      test('object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
@@ -79,19 +79,19 @@ export function objectTests(Form: ComponentType<FormProps>) {
             b: { type: 'number', title: 'B', description: 'B description' },
           },
         };
-        const tree = renderer.create(<Form schema={schema} validator={validator} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} validator={validator} />);
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('additionalProperties', () => {
+      test('additionalProperties', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
           additionalProperties: true,
         };
-        const tree = renderer.create(<Form schema={schema} validator={validator} formData={{ foo: 'foo' }} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} validator={validator} formData={{ foo: 'foo' }} />);
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('show add button and fields if additionalProperties is true and not an object', () => {
+      test('show add button and fields if additionalProperties is true and not an object', async () => {
         const schema: RJSFSchema = {
           ...titleAndDesc,
           additionalProperties: true,
@@ -99,12 +99,12 @@ export function objectTests(Form: ComponentType<FormProps>) {
         const formData: any = {
           additionalProperty: 'should appear',
         };
-        const tree = renderer.create(<Form schema={schema} validator={validator} formData={formData} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} validator={validator} formData={formData} />);
+        expect(asFragment()).toMatchSnapshot();
       });
     });
     describe('with title and description from uiSchema', () => {
-      test('object', () => {
+      test('object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -112,34 +112,34 @@ export function objectTests(Form: ComponentType<FormProps>) {
             b: { type: 'number', title: 'B' },
           },
         };
-        const tree = renderer.create(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} />);
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('additionalProperties', () => {
+      test('additionalProperties', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           additionalProperties: true,
         };
-        const tree = renderer
-          .create(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={{ foo: 'foo' }} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={{ foo: 'foo' }} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('show add button and fields if additionalProperties is true and not an object', () => {
+      test('show add button and fields if additionalProperties is true and not an object', async () => {
         const schema: RJSFSchema = {
           additionalProperties: true,
         };
         const formData: any = {
           additionalProperty: 'should appear',
         };
-        const tree = renderer
-          .create(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={formData} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={formData} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
     });
     describe('with title and description from both', () => {
-      test('object', () => {
+      test('object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
@@ -148,23 +148,23 @@ export function objectTests(Form: ComponentType<FormProps>) {
             b: { type: 'number', title: 'B', description: 'B description' },
           },
         };
-        const tree = renderer.create(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} />);
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('additionalProperties', () => {
+      test('additionalProperties', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
           additionalProperties: true,
         };
-        const tree = renderer
-          .create(<Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={{ foo: 'foo' }} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} uiSchema={uiTitleAndDesc} validator={validator} formData={{ foo: 'foo' }} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
     });
     describe('with title and description with global label off', () => {
-      test('object', () => {
+      test('object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
@@ -173,21 +173,21 @@ export function objectTests(Form: ComponentType<FormProps>) {
             b: { type: 'number', title: 'B', description: 'B description' },
           },
         };
-        const tree = renderer.create(<Form schema={schema} uiSchema={labelsOff} validator={validator} />).toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(<Form schema={schema} uiSchema={labelsOff} validator={validator} />);
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('additionalProperties', () => {
+      test('additionalProperties', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           ...titleAndDesc,
           additionalProperties: true,
         };
-        const tree = renderer
-          .create(<Form schema={schema} uiSchema={labelsOff} validator={validator} formData={{ foo: 'foo' }} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} uiSchema={labelsOff} validator={validator} formData={{ foo: 'foo' }} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
-      test('show add button and fields if additionalProperties is true and not an object', () => {
+      test('show add button and fields if additionalProperties is true and not an object', async () => {
         const schema: RJSFSchema = {
           ...titleAndDesc,
           additionalProperties: true,
@@ -195,17 +195,17 @@ export function objectTests(Form: ComponentType<FormProps>) {
         const formData: any = {
           additionalProperty: 'should appear',
         };
-        const tree = renderer
-          .create(<Form schema={schema} uiSchema={labelsOff} validator={validator} formData={formData} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} uiSchema={labelsOff} validator={validator} formData={formData} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
     });
   });
 
   describe('nameGenerator', () => {
     describe('bracketNameGenerator', () => {
-      test('simple object', () => {
+      test('simple object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -214,13 +214,13 @@ export function objectTests(Form: ComponentType<FormProps>) {
             age: { type: 'number' },
           },
         };
-        const tree = renderer
-          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
 
-      test('nested object', () => {
+      test('nested object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -240,13 +240,13 @@ export function objectTests(Form: ComponentType<FormProps>) {
             },
           },
         };
-        const tree = renderer
-          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
 
-      test('object with additionalProperties', () => {
+      test('object with additionalProperties', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -258,15 +258,13 @@ export function objectTests(Form: ComponentType<FormProps>) {
           name: 'John',
           customField: 'customValue',
         };
-        const tree = renderer
-          .create(
-            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
-          )
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
 
-      test('object with mixed types', () => {
+      test('object with mixed types', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -285,17 +283,15 @@ export function objectTests(Form: ComponentType<FormProps>) {
           active: true,
           tags: ['developer', 'designer'],
         };
-        const tree = renderer
-          .create(
-            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
-          )
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
     });
 
     describe('dotNotationNameGenerator', () => {
-      test('simple object', () => {
+      test('simple object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -304,13 +300,13 @@ export function objectTests(Form: ComponentType<FormProps>) {
             age: { type: 'number' },
           },
         };
-        const tree = renderer
-          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
 
-      test('nested object', () => {
+      test('nested object', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -329,13 +325,13 @@ export function objectTests(Form: ComponentType<FormProps>) {
             },
           },
         };
-        const tree = renderer
-          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
 
-      test('object with mixed types', () => {
+      test('object with mixed types', async () => {
         const schema: RJSFSchema = {
           type: 'object',
           properties: {
@@ -352,12 +348,10 @@ export function objectTests(Form: ComponentType<FormProps>) {
           count: 5,
           items: ['a', 'b'],
         };
-        const tree = renderer
-          .create(
-            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
-          )
-          .toJSON();
-        expect(tree).toMatchSnapshot();
+        const { asFragment } = render(
+          <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+        );
+        expect(asFragment()).toMatchSnapshot();
       });
     });
   });