diff --git a/packages/antd/test/__snapshots__/Array.test.tsx.snap b/packages/antd/test/__snapshots__/Array.test.tsx.snap
index abcf95cb6c..f5f017e871 100644
--- a/packages/antd/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Array.test.tsx.snap
@@ -1839,6 +1839,5402 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      id="root_0"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_0_name"
+                                                    title="name"
+                                                  >
+                                                    name
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          disabled={false}
+                                                          id="root_0_name"
+                                                          name="root[0][name]"
+                                                          onBlur={[Function]}
+                                                          onChange={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                          placeholder=""
+                                                          type="text"
+                                                          value="Item 1"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-number"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_0_value"
+                                                    title="value"
+                                                  >
+                                                    value
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <div
+                                                        className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                          onBeforeInput={[Function]}
+                                                          onBlur={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                        >
+                                                          <div
+                                                            className="ant-input-number-handler-wrap"
+                                                          >
+                                                            <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"
+                                                            >
+                                                              <span
+                                                                aria-label="up"
+                                                                className="anticon anticon-up ant-input-number-handler-up-inner"
+                                                                role="img"
+                                                              >
+                                                                <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
+                                                              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"
+                                                              >
+                                                                <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>
+                                                          </div>
+                                                          <div
+                                                            className="ant-input-number-input-wrap"
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                                              aria-valuenow="10"
+                                                              autoComplete="off"
+                                                              className="ant-input-number-input"
+                                                              disabled={false}
+                                                              id="root_0_value"
+                                                              name="root[0][value]"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onFocus={[Function]}
+                                                              placeholder=""
+                                                              role="spinbutton"
+                                                              step={1}
+                                                              type="number"
+                                                              value="10"
+                                                            />
+                                                          </div>
+                                                        </div>
+                                                        <span
+                                                          className="ant-input-number-suffix"
+                                                        />
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      id="root_1"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_1_name"
+                                                    title="name"
+                                                  >
+                                                    name
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          disabled={false}
+                                                          id="root_1_name"
+                                                          name="root[1][name]"
+                                                          onBlur={[Function]}
+                                                          onChange={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                          placeholder=""
+                                                          type="text"
+                                                          value="Item 2"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-number"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_1_value"
+                                                    title="value"
+                                                  >
+                                                    value
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <div
+                                                        className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                          onBeforeInput={[Function]}
+                                                          onBlur={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                        >
+                                                          <div
+                                                            className="ant-input-number-handler-wrap"
+                                                          >
+                                                            <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"
+                                                            >
+                                                              <span
+                                                                aria-label="up"
+                                                                className="anticon anticon-up ant-input-number-handler-up-inner"
+                                                                role="img"
+                                                              >
+                                                                <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
+                                                              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"
+                                                              >
+                                                                <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>
+                                                          </div>
+                                                          <div
+                                                            className="ant-input-number-input-wrap"
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                                              aria-valuenow="20"
+                                                              autoComplete="off"
+                                                              className="ant-input-number-input"
+                                                              disabled={false}
+                                                              id="root_1_value"
+                                                              name="root[1][value]"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onFocus={[Function]}
+                                                              placeholder=""
+                                                              role="spinbutton"
+                                                              step={1}
+                                                              type="number"
+                                                              value="20"
+                                                            />
+                                                          </div>
+                                                        </div>
+                                                        <span
+                                                          className="ant-input-number-suffix"
+                                                        />
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <button
+                          className="ant-btn css-dev-only-do-not-override-xepvsj 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__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>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_0__error root_0__description root_0__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        disabled={false}
+                                        id="root_0"
+                                        name="root[0]"
+                                        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>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_1__error root_1__description root_1__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        disabled={false}
+                                        id="root_1"
+                                        name="root[1]"
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onCompositionEnd={[Function]}
+                                        onCompositionStart={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        onKeyUp={[Function]}
+                                        placeholder=""
+                                        type="text"
+                                        value="bar"
+                                      />
+                                      <span
+                                        className="ant-input-suffix"
+                                      />
+                                    </span>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <button
+                          className="ant-btn css-dev-only-do-not-override-xepvsj 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__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>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <div
+                aria-describedby="root__error root__description root__help"
+                className="ant-select ant-select-outlined ant-select-in-form-item css-dev-only-do-not-override-xepvsj ant-select-multiple ant-select-show-arrow ant-select-show-search"
+                name="root"
+                onBlur={[Function]}
+                onFocus={[Function]}
+                onKeyDown={[Function]}
+                onKeyUp={[Function]}
+                onMouseDown={[Function]}
+                style={
+                  {
+                    "width": "100%",
+                  }
+                }
+              >
+                <div
+                  className="ant-select-selector"
+                  onClick={[Function]}
+                  onMouseDown={[Function]}
+                >
+                  <span
+                    className="ant-select-selection-wrap"
+                  >
+                    <div
+                      className="ant-select-selection-overflow"
+                    >
+                      <div
+                        className="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
+                        style={
+                          {
+                            "height": undefined,
+                            "opacity": 1,
+                            "order": undefined,
+                            "overflowY": undefined,
+                            "pointerEvents": undefined,
+                            "position": undefined,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-select-selection-search"
+                          onBlur={[Function]}
+                          onFocus={[Function]}
+                          style={
+                            {
+                              "width": 100,
+                            }
+                          }
+                        >
+                          <input
+                            aria-autocomplete="list"
+                            aria-controls="root_list"
+                            aria-describedby="root__error root__description root__help"
+                            aria-expanded={false}
+                            aria-haspopup="listbox"
+                            aria-owns="root_list"
+                            autoComplete="off"
+                            autoFocus={false}
+                            className="ant-select-selection-search-input"
+                            disabled={false}
+                            id="root"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onCompositionEnd={[Function]}
+                            onCompositionStart={[Function]}
+                            onKeyDown={[Function]}
+                            onMouseDown={[Function]}
+                            onPaste={[Function]}
+                            readOnly={true}
+                            role="combobox"
+                            style={
+                              {
+                                "opacity": 0,
+                              }
+                            }
+                            type="search"
+                            unselectable="on"
+                            value=""
+                          />
+                          <span
+                            aria-hidden={true}
+                            className="ant-select-selection-search-mirror"
+                          >
+                             
+                          </span>
+                        </div>
+                      </div>
+                    </div>
+                    <span
+                      className="ant-select-selection-placeholder"
+                    />
+                  </span>
+                </div>
+                <span
+                  aria-hidden={true}
+                  className="ant-select-arrow"
+                  onMouseDown={[Function]}
+                  style={
+                    {
+                      "WebkitUserSelect": "none",
+                      "userSelect": "none",
+                    }
+                  }
+                  unselectable="on"
+                >
+                  <span
+                    aria-label="down"
+                    className="anticon anticon-down ant-select-suffix"
+                    role="img"
+                  >
+                    <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>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-fixed-items"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_0__error root_0__description root_0__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        disabled={false}
+                                        id="root_0"
+                                        name="root[0]"
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onCompositionEnd={[Function]}
+                                        onCompositionStart={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        onKeyUp={[Function]}
+                                        placeholder=""
+                                        type="text"
+                                        value="text"
+                                      />
+                                      <span
+                                        className="ant-input-suffix"
+                                      />
+                                    </span>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-number"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <div
+                                      className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                        onBeforeInput={[Function]}
+                                        onBlur={[Function]}
+                                        onCompositionEnd={[Function]}
+                                        onCompositionStart={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        onKeyUp={[Function]}
+                                      >
+                                        <div
+                                          className="ant-input-number-handler-wrap"
+                                        >
+                                          <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"
+                                          >
+                                            <span
+                                              aria-label="up"
+                                              className="anticon anticon-up ant-input-number-handler-up-inner"
+                                              role="img"
+                                            >
+                                              <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
+                                            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"
+                                            >
+                                              <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>
+                                        </div>
+                                        <div
+                                          className="ant-input-number-input-wrap"
+                                        >
+                                          <input
+                                            aria-describedby="root_1__error root_1__description root_1__help"
+                                            aria-valuenow="42"
+                                            autoComplete="off"
+                                            className="ant-input-number-input"
+                                            disabled={false}
+                                            id="root_1"
+                                            name="root[1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            role="spinbutton"
+                                            step={1}
+                                            type="number"
+                                            value="42"
+                                          />
+                                        </div>
+                                      </div>
+                                      <span
+                                        className="ant-input-number-suffix"
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-boolean"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <label
+                                      className="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                      onClick={[Function]}
+                                      style={{}}
+                                    >
+                                      <span
+                                        className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj ant-checkbox-checked"
+                                      >
+                                        <input
+                                          aria-describedby="root_2__error root_2__description root_2__help"
+                                          autoFocus={false}
+                                          checked={true}
+                                          className="ant-checkbox-input"
+                                          disabled={false}
+                                          id="root_2"
+                                          name="root[2]"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onClick={[Function]}
+                                          onFocus={[Function]}
+                                          type="checkbox"
+                                        />
+                                        <span
+                                          className="ant-checkbox-inner"
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-checkbox-label"
+                                      />
+                                    </label>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-array"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-array"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                      id="root_0"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "1",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="rjsf-field rjsf-field-string"
+                                              >
+                                                <div
+                                                  className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                >
+                                                  <div
+                                                    className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                    style={
+                                                      {
+                                                        "rowGap": undefined,
+                                                      }
+                                                    }
+                                                  >
+                                                    <div
+                                                      className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                      style={{}}
+                                                    >
+                                                      <div
+                                                        className="ant-form-item-control-input"
+                                                      >
+                                                        <div
+                                                          className="ant-form-item-control-input-content"
+                                                        >
+                                                          <span
+                                                            className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                            onClick={[Function]}
+                                                            style={
+                                                              {
+                                                                "width": "100%",
+                                                              }
+                                                            }
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                                              className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                              disabled={false}
+                                                              id="root_0_0"
+                                                              name="root[0][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>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "width": "100%",
+                                                  }
+                                                }
+                                              >
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_0__moveUp"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move up"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-up"
+                                                      className="anticon anticon-arrow-up"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_0__moveDown"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move down"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-down"
+                                                      className="anticon anticon-arrow-down"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_0__remove"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Remove"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="delete"
+                                                      className="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
+                                            className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "1",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="rjsf-field rjsf-field-string"
+                                              >
+                                                <div
+                                                  className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                >
+                                                  <div
+                                                    className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                    style={
+                                                      {
+                                                        "rowGap": undefined,
+                                                      }
+                                                    }
+                                                  >
+                                                    <div
+                                                      className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                      style={{}}
+                                                    >
+                                                      <div
+                                                        className="ant-form-item-control-input"
+                                                      >
+                                                        <div
+                                                          className="ant-form-item-control-input-content"
+                                                        >
+                                                          <span
+                                                            className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                            onClick={[Function]}
+                                                            style={
+                                                              {
+                                                                "width": "100%",
+                                                              }
+                                                            }
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                                              className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                              disabled={false}
+                                                              id="root_0_1"
+                                                              name="root[0][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>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "width": "100%",
+                                                  }
+                                                }
+                                              >
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_1__moveUp"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move up"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-up"
+                                                      className="anticon anticon-arrow-up"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_1__moveDown"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move down"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-down"
+                                                      className="anticon anticon-arrow-down"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_0_1__remove"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Remove"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="delete"
+                                                      className="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
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <button
+                                                className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__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>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-array"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                      id="root_1"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "1",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="rjsf-field rjsf-field-string"
+                                              >
+                                                <div
+                                                  className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                >
+                                                  <div
+                                                    className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                    style={
+                                                      {
+                                                        "rowGap": undefined,
+                                                      }
+                                                    }
+                                                  >
+                                                    <div
+                                                      className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                      style={{}}
+                                                    >
+                                                      <div
+                                                        className="ant-form-item-control-input"
+                                                      >
+                                                        <div
+                                                          className="ant-form-item-control-input-content"
+                                                        >
+                                                          <span
+                                                            className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                            onClick={[Function]}
+                                                            style={
+                                                              {
+                                                                "width": "100%",
+                                                              }
+                                                            }
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                                              className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                              disabled={false}
+                                                              id="root_1_0"
+                                                              name="root[1][0]"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onCompositionEnd={[Function]}
+                                                              onCompositionStart={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              placeholder=""
+                                                              type="text"
+                                                              value="c"
+                                                            />
+                                                            <span
+                                                              className="ant-input-suffix"
+                                                            />
+                                                          </span>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "width": "100%",
+                                                  }
+                                                }
+                                              >
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_0__moveUp"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move up"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-up"
+                                                      className="anticon anticon-arrow-up"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_0__moveDown"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move down"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-down"
+                                                      className="anticon anticon-arrow-down"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_0__remove"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Remove"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="delete"
+                                                      className="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
+                                            className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "1",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="rjsf-field rjsf-field-string"
+                                              >
+                                                <div
+                                                  className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                >
+                                                  <div
+                                                    className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                    style={
+                                                      {
+                                                        "rowGap": undefined,
+                                                      }
+                                                    }
+                                                  >
+                                                    <div
+                                                      className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                      style={{}}
+                                                    >
+                                                      <div
+                                                        className="ant-form-item-control-input"
+                                                      >
+                                                        <div
+                                                          className="ant-form-item-control-input-content"
+                                                        >
+                                                          <span
+                                                            className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                            onClick={[Function]}
+                                                            style={
+                                                              {
+                                                                "width": "100%",
+                                                              }
+                                                            }
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                                              className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                              disabled={false}
+                                                              id="root_1_1"
+                                                              name="root[1][1]"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onCompositionEnd={[Function]}
+                                                              onCompositionStart={[Function]}
+                                                              onFocus={[Function]}
+                                                              onKeyDown={[Function]}
+                                                              onKeyUp={[Function]}
+                                                              placeholder=""
+                                                              type="text"
+                                                              value="d"
+                                                            />
+                                                            <span
+                                                              className="ant-input-suffix"
+                                                            />
+                                                          </span>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <div
+                                                className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "width": "100%",
+                                                  }
+                                                }
+                                              >
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_1__moveUp"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move up"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-up"
+                                                      className="anticon anticon-arrow-up"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_1__moveDown"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Move down"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="arrow-down"
+                                                      className="anticon anticon-arrow-down"
+                                                      role="img"
+                                                    >
+                                                      <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>
+                                                </button>
+                                                <button
+                                                  className="ant-btn css-dev-only-do-not-override-xepvsj 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_1_1__remove"
+                                                  onClick={[Function]}
+                                                  style={
+                                                    {
+                                                      "paddingTop": "4px",
+                                                    }
+                                                  }
+                                                  title="Remove"
+                                                  type="button"
+                                                >
+                                                  <span
+                                                    className="ant-btn-icon"
+                                                    style={{}}
+                                                  >
+                                                    <span
+                                                      aria-label="delete"
+                                                      className="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
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "marginLeft": -12,
+                                                "marginRight": -12,
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col css-dev-only-do-not-override-xepvsj"
+                                              style={
+                                                {
+                                                  "flex": "0 0 192px",
+                                                  "paddingLeft": 12,
+                                                  "paddingRight": 12,
+                                                }
+                                              }
+                                            >
+                                              <button
+                                                className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__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>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <button
+                          className="ant-btn css-dev-only-do-not-override-xepvsj 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__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>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      id="root_0"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_0_name"
+                                                    title="name"
+                                                  >
+                                                    name
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          disabled={false}
+                                                          id="root_0_name"
+                                                          name="root.0.name"
+                                                          onBlur={[Function]}
+                                                          onChange={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                          placeholder=""
+                                                          type="text"
+                                                          value="Item 1"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-number"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_0_value"
+                                                    title="value"
+                                                  >
+                                                    value
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <div
+                                                        className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                          onBeforeInput={[Function]}
+                                                          onBlur={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                        >
+                                                          <div
+                                                            className="ant-input-number-handler-wrap"
+                                                          >
+                                                            <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"
+                                                            >
+                                                              <span
+                                                                aria-label="up"
+                                                                className="anticon anticon-up ant-input-number-handler-up-inner"
+                                                                role="img"
+                                                              >
+                                                                <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
+                                                              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"
+                                                              >
+                                                                <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>
+                                                          </div>
+                                                          <div
+                                                            className="ant-input-number-input-wrap"
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                                              aria-valuenow="10"
+                                                              autoComplete="off"
+                                                              className="ant-input-number-input"
+                                                              disabled={false}
+                                                              id="root_0_value"
+                                                              name="root.0.value"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onFocus={[Function]}
+                                                              placeholder=""
+                                                              role="spinbutton"
+                                                              step={1}
+                                                              type="number"
+                                                              value="10"
+                                                            />
+                                                          </div>
+                                                        </div>
+                                                        <span
+                                                          className="ant-input-number-suffix"
+                                                        />
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <fieldset
+                                      id="root_1"
+                                    >
+                                      <div
+                                        className="ant-row css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_1_name"
+                                                    title="name"
+                                                  >
+                                                    name
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          disabled={false}
+                                                          id="root_1_name"
+                                                          name="root.1.name"
+                                                          onBlur={[Function]}
+                                                          onChange={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                          placeholder=""
+                                                          type="text"
+                                                          value="Item 2"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-number"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className=""
+                                                    htmlFor="root_1_value"
+                                                    title="value"
+                                                  >
+                                                    value
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <div
+                                                        className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                          onBeforeInput={[Function]}
+                                                          onBlur={[Function]}
+                                                          onCompositionEnd={[Function]}
+                                                          onCompositionStart={[Function]}
+                                                          onFocus={[Function]}
+                                                          onKeyDown={[Function]}
+                                                          onKeyUp={[Function]}
+                                                        >
+                                                          <div
+                                                            className="ant-input-number-handler-wrap"
+                                                          >
+                                                            <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"
+                                                            >
+                                                              <span
+                                                                aria-label="up"
+                                                                className="anticon anticon-up ant-input-number-handler-up-inner"
+                                                                role="img"
+                                                              >
+                                                                <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
+                                                              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"
+                                                              >
+                                                                <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>
+                                                          </div>
+                                                          <div
+                                                            className="ant-input-number-input-wrap"
+                                                          >
+                                                            <input
+                                                              aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                                              aria-valuenow="20"
+                                                              autoComplete="off"
+                                                              className="ant-input-number-input"
+                                                              disabled={false}
+                                                              id="root_1_value"
+                                                              name="root.1.value"
+                                                              onBlur={[Function]}
+                                                              onChange={[Function]}
+                                                              onFocus={[Function]}
+                                                              placeholder=""
+                                                              role="spinbutton"
+                                                              step={1}
+                                                              type="number"
+                                                              value="20"
+                                                            />
+                                                          </div>
+                                                        </div>
+                                                        <span
+                                                          className="ant-input-number-suffix"
+                                                        />
+                                                      </div>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <button
+                          className="ant-btn css-dev-only-do-not-override-xepvsj 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__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>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 row array-item-list css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_0__error root_0__description root_0__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        disabled={false}
+                                        id="root_0"
+                                        name="root.0"
+                                        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>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_0__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                      className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "1",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_1__error root_1__description root_1__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        disabled={false}
+                                        id="root_1"
+                                        name="root.1"
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onCompositionEnd={[Function]}
+                                        onCompositionStart={[Function]}
+                                        onFocus={[Function]}
+                                        onKeyDown={[Function]}
+                                        onKeyUp={[Function]}
+                                        placeholder=""
+                                        type="text"
+                                        value="bar"
+                                      />
+                                      <span
+                                        className="ant-input-suffix"
+                                      />
+                                    </span>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "width": "100%",
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveUp"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move up"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-up"
+                                className="anticon anticon-arrow-up"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__moveDown"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Move down"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="arrow-down"
+                                className="anticon anticon-arrow-down"
+                                role="img"
+                              >
+                                <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>
+                          </button>
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_1__remove"
+                            onClick={[Function]}
+                            style={
+                              {
+                                "paddingTop": "4px",
+                              }
+                            }
+                            title="Remove"
+                            type="button"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "marginLeft": -12,
+                          "marginRight": -12,
+                          "rowGap": undefined,
+                        }
+                      }
+                    >
+                      <div
+                        className="ant-col css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "flex": "0 0 192px",
+                            "paddingLeft": 12,
+                            "paddingRight": 12,
+                          }
+                        }
+                      >
+                        <button
+                          className="ant-btn css-dev-only-do-not-override-xepvsj 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__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>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/antd/test/__snapshots__/Form.test.tsx.snap b/packages/antd/test/__snapshots__/Form.test.tsx.snap
index 5f09a7dcd0..51a45fd6e7 100644
--- a/packages/antd/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Form.test.tsx.snap
@@ -177,6 +177,6235 @@ exports[`antd specific tests descriptionLocation tooltip in formContext 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                                  id="root_tasks"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_tasks__title"
+                                        onClick={[Function]}
+                                        title="tasks"
+                                      >
+                                        tasks
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-object"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <fieldset
+                                                        id="root_tasks_0"
+                                                      >
+                                                        <div
+                                                          className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                          style={
+                                                            {
+                                                              "marginLeft": -12,
+                                                              "marginRight": -12,
+                                                              "rowGap": undefined,
+                                                            }
+                                                          }
+                                                        >
+                                                          <div
+                                                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <label
+                                                              className="ant-form-item-required"
+                                                              htmlFor="root_tasks_0__title"
+                                                              onClick={[Function]}
+                                                              title="tasks-1"
+                                                            >
+                                                              tasks-1
+                                                            </label>
+                                                            <div
+                                                              className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-string"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <label
+                                                                      className=""
+                                                                      htmlFor="root_tasks_0_title"
+                                                                      title="title"
+                                                                    >
+                                                                      title
+                                                                    </label>
+                                                                  </div>
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <span
+                                                                          className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                          onClick={[Function]}
+                                                                          style={
+                                                                            {
+                                                                              "width": "100%",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <input
+                                                                            aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                                                            className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                                            disabled={false}
+                                                                            id="root_tasks_0_title"
+                                                                            name="root[tasks][0][title]"
+                                                                            onBlur={[Function]}
+                                                                            onChange={[Function]}
+                                                                            onCompositionEnd={[Function]}
+                                                                            onCompositionStart={[Function]}
+                                                                            onFocus={[Function]}
+                                                                            onKeyDown={[Function]}
+                                                                            onKeyUp={[Function]}
+                                                                            placeholder=""
+                                                                            type="text"
+                                                                            value="Task 1"
+                                                                          />
+                                                                          <span
+                                                                            className="ant-input-suffix"
+                                                                          />
+                                                                        </span>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                          <div
+                                                            className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-boolean"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <label
+                                                                          className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                                          onClick={[Function]}
+                                                                          style={{}}
+                                                                        >
+                                                                          <span
+                                                                            className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                                                          >
+                                                                            <input
+                                                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                                                              autoFocus={false}
+                                                                              checked={false}
+                                                                              className="ant-checkbox-input"
+                                                                              disabled={false}
+                                                                              id="root_tasks_0_done"
+                                                                              name="root[tasks][0][done]"
+                                                                              onBlur={[Function]}
+                                                                              onChange={[Function]}
+                                                                              onClick={[Function]}
+                                                                              onFocus={[Function]}
+                                                                              type="checkbox"
+                                                                            />
+                                                                            <span
+                                                                              className="ant-checkbox-inner"
+                                                                            />
+                                                                          </span>
+                                                                          <span
+                                                                            className="ant-checkbox-label"
+                                                                          >
+                                                                            done
+                                                                          </span>
+                                                                        </label>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </fieldset>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__moveUp"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move up"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__moveDown"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move down"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__remove"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Remove"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-object"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <fieldset
+                                                        id="root_tasks_1"
+                                                      >
+                                                        <div
+                                                          className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                          style={
+                                                            {
+                                                              "marginLeft": -12,
+                                                              "marginRight": -12,
+                                                              "rowGap": undefined,
+                                                            }
+                                                          }
+                                                        >
+                                                          <div
+                                                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <label
+                                                              className="ant-form-item-required"
+                                                              htmlFor="root_tasks_1__title"
+                                                              onClick={[Function]}
+                                                              title="tasks-2"
+                                                            >
+                                                              tasks-2
+                                                            </label>
+                                                            <div
+                                                              className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-string"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <label
+                                                                      className=""
+                                                                      htmlFor="root_tasks_1_title"
+                                                                      title="title"
+                                                                    >
+                                                                      title
+                                                                    </label>
+                                                                  </div>
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <span
+                                                                          className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                          onClick={[Function]}
+                                                                          style={
+                                                                            {
+                                                                              "width": "100%",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <input
+                                                                            aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                                                            className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                                            disabled={false}
+                                                                            id="root_tasks_1_title"
+                                                                            name="root[tasks][1][title]"
+                                                                            onBlur={[Function]}
+                                                                            onChange={[Function]}
+                                                                            onCompositionEnd={[Function]}
+                                                                            onCompositionStart={[Function]}
+                                                                            onFocus={[Function]}
+                                                                            onKeyDown={[Function]}
+                                                                            onKeyUp={[Function]}
+                                                                            placeholder=""
+                                                                            type="text"
+                                                                            value="Task 2"
+                                                                          />
+                                                                          <span
+                                                                            className="ant-input-suffix"
+                                                                          />
+                                                                        </span>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                          <div
+                                                            className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-boolean"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <label
+                                                                          className="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                                          onClick={[Function]}
+                                                                          style={{}}
+                                                                        >
+                                                                          <span
+                                                                            className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj ant-checkbox-checked"
+                                                                          >
+                                                                            <input
+                                                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                                                              autoFocus={false}
+                                                                              checked={true}
+                                                                              className="ant-checkbox-input"
+                                                                              disabled={false}
+                                                                              id="root_tasks_1_done"
+                                                                              name="root[tasks][1][done]"
+                                                                              onBlur={[Function]}
+                                                                              onChange={[Function]}
+                                                                              onClick={[Function]}
+                                                                              onFocus={[Function]}
+                                                                              type="checkbox"
+                                                                            />
+                                                                            <span
+                                                                              className="ant-checkbox-inner"
+                                                                            />
+                                                                          </span>
+                                                                          <span
+                                                                            className="ant-checkbox-label"
+                                                                          >
+                                                                            done
+                                                                          </span>
+                                                                        </label>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </fieldset>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__moveUp"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move up"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__moveDown"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move down"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__remove"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Remove"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks__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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                  id="root_tags"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_tags__title"
+                                        onClick={[Function]}
+                                        title="tags"
+                                      >
+                                        tags
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_0"
+                                                    title="tags-1"
+                                                  >
+                                                    tags-1
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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="foo"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_1"
+                                                    title="tags-2"
+                                                  >
+                                                    tags-2
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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="bar"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_choices"
+                              title="choices"
+                            >
+                              choices
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                                  className="ant-checkbox-group css-dev-only-do-not-override-xepvsj"
+                                  id="root_choices"
+                                  name="root[choices][]"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                >
+                                  <span>
+                                    <label
+                                      className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                      onClick={[Function]}
+                                      style={{}}
+                                    >
+                                      <span
+                                        className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                      >
+                                        <input
+                                          autoFocus={false}
+                                          checked={false}
+                                          className="ant-checkbox-input"
+                                          disabled={false}
+                                          id="root_choices-0"
+                                          name="root[choices][]"
+                                          onChange={[Function]}
+                                          onClick={[Function]}
+                                          type="checkbox"
+                                          value="0"
+                                        />
+                                        <span
+                                          className="ant-checkbox-inner"
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-checkbox-label"
+                                      >
+                                        foo
+                                      </span>
+                                    </label>
+                                    <br />
+                                  </span>
+                                  <span>
+                                    <label
+                                      className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                      onClick={[Function]}
+                                      style={{}}
+                                    >
+                                      <span
+                                        className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                      >
+                                        <input
+                                          autoFocus={false}
+                                          checked={false}
+                                          className="ant-checkbox-input"
+                                          disabled={false}
+                                          id="root_choices-1"
+                                          name="root[choices][]"
+                                          onChange={[Function]}
+                                          onClick={[Function]}
+                                          type="checkbox"
+                                          value="1"
+                                        />
+                                        <span
+                                          className="ant-checkbox-inner"
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-checkbox-label"
+                                      >
+                                        bar
+                                      </span>
+                                    </label>
+                                    <br />
+                                  </span>
+                                  <span>
+                                    <label
+                                      className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                      onClick={[Function]}
+                                      style={{}}
+                                    >
+                                      <span
+                                        className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                      >
+                                        <input
+                                          autoFocus={false}
+                                          checked={false}
+                                          className="ant-checkbox-input"
+                                          disabled={false}
+                                          id="root_choices-2"
+                                          name="root[choices][]"
+                                          onChange={[Function]}
+                                          onClick={[Function]}
+                                          type="checkbox"
+                                          value="2"
+                                        />
+                                        <span
+                                          className="ant-checkbox-inner"
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-checkbox-label"
+                                      >
+                                        baz
+                                      </span>
+                                    </label>
+                                    <br />
+                                  </span>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  id="root_person"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_person__title"
+                                        onClick={[Function]}
+                                        title="person"
+                                      >
+                                        person
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_firstName"
+                                                title="firstName"
+                                              >
+                                                firstName
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      disabled={false}
+                                                      id="root_person_firstName"
+                                                      name="root[person][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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_lastName"
+                                                title="lastName"
+                                              >
+                                                lastName
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      disabled={false}
+                                                      id="root_person_lastName"
+                                                      name="root[person][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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-object"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <fieldset
+                                                    id="root_person_address"
+                                                  >
+                                                    <div
+                                                      className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                      style={
+                                                        {
+                                                          "marginLeft": -12,
+                                                          "marginRight": -12,
+                                                          "rowGap": undefined,
+                                                        }
+                                                      }
+                                                    >
+                                                      <div
+                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <label
+                                                          className=""
+                                                          htmlFor="root_person_address__title"
+                                                          onClick={[Function]}
+                                                          title="address"
+                                                        >
+                                                          address
+                                                        </label>
+                                                        <div
+                                                          className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_street"
+                                                                  title="street"
+                                                                >
+                                                                  street
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                      <div
+                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_city"
+                                                                  title="city"
+                                                                >
+                                                                  city
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </fieldset>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </fieldset>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_option"
+                              title="option"
+                            >
+                              option
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  aria-describedby="root_option__error root_option__description root_option__help"
+                                  className="ant-radio-group ant-radio-group-outline css-dev-only-do-not-override-xepvsj"
+                                  id="root_option"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                >
+                                  <label
+                                    className="ant-radio-wrapper ant-radio-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onClick={[Function]}
+                                    style={{}}
+                                  >
+                                    <span
+                                      className="ant-radio ant-wave-target"
+                                    >
+                                      <input
+                                        autoFocus={false}
+                                        checked={false}
+                                        className="ant-radio-input"
+                                        disabled={false}
+                                        id="root_option-0"
+                                        name="root[option]"
+                                        onChange={[Function]}
+                                        onClick={[Function]}
+                                        type="radio"
+                                        value="0"
+                                      />
+                                      <span
+                                        className="ant-radio-inner"
+                                      />
+                                    </span>
+                                    <span
+                                      className="ant-radio-label"
+                                    >
+                                      foo
+                                    </span>
+                                  </label>
+                                  <label
+                                    className="ant-radio-wrapper ant-radio-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onClick={[Function]}
+                                    style={{}}
+                                  >
+                                    <span
+                                      className="ant-radio ant-wave-target"
+                                    >
+                                      <input
+                                        autoFocus={false}
+                                        checked={false}
+                                        className="ant-radio-input"
+                                        disabled={false}
+                                        id="root_option-1"
+                                        name="root[option]"
+                                        onChange={[Function]}
+                                        onClick={[Function]}
+                                        type="radio"
+                                        value="1"
+                                      />
+                                      <span
+                                        className="ant-radio-inner"
+                                      />
+                                    </span>
+                                    <span
+                                      className="ant-radio-label"
+                                    >
+                                      bar
+                                    </span>
+                                  </label>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_color"
+                              title="color"
+                            >
+                              color
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  aria-describedby="root_color__error root_color__description root_color__help"
+                                  className="ant-select ant-select-outlined ant-select-in-form-item ant-select-has-feedback css-dev-only-do-not-override-xepvsj ant-select-single ant-select-show-arrow"
+                                  name="root[color]"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                  onKeyDown={[Function]}
+                                  onKeyUp={[Function]}
+                                  onMouseDown={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-select-selector"
+                                    onClick={[Function]}
+                                    onMouseDown={[Function]}
+                                  >
+                                    <span
+                                      className="ant-select-selection-wrap"
+                                    >
+                                      <span
+                                        className="ant-select-selection-search"
+                                      >
+                                        <input
+                                          aria-autocomplete="list"
+                                          aria-controls="root_color_list"
+                                          aria-describedby="root_color__error root_color__description root_color__help"
+                                          aria-expanded={false}
+                                          aria-haspopup="listbox"
+                                          aria-owns="root_color_list"
+                                          autoComplete="off"
+                                          autoFocus={false}
+                                          className="ant-select-selection-search-input"
+                                          disabled={false}
+                                          id="root_color"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onCompositionEnd={[Function]}
+                                          onCompositionStart={[Function]}
+                                          onKeyDown={[Function]}
+                                          onMouseDown={[Function]}
+                                          onPaste={[Function]}
+                                          readOnly={true}
+                                          role="combobox"
+                                          style={
+                                            {
+                                              "opacity": 0,
+                                            }
+                                          }
+                                          type="search"
+                                          unselectable="on"
+                                          value=""
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-select-selection-placeholder"
+                                      />
+                                    </span>
+                                  </div>
+                                  <span
+                                    aria-hidden={true}
+                                    className="ant-select-arrow"
+                                    onMouseDown={[Function]}
+                                    style={
+                                      {
+                                        "WebkitUserSelect": "none",
+                                        "userSelect": "none",
+                                      }
+                                    }
+                                    unselectable="on"
+                                  >
+                                    <span
+                                      aria-label="down"
+                                      className="anticon anticon-down ant-select-suffix"
+                                      role="img"
+                                    >
+                                      <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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_firstName"
+                              title="firstName"
+                            >
+                              firstName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_age"
+                              title="age"
+                            >
+                              age
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <label
+                                  className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                  onClick={[Function]}
+                                  style={{}}
+                                >
+                                  <span
+                                    className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                  >
+                                    <input
+                                      aria-describedby="root_active__error root_active__description root_active__help"
+                                      autoFocus={false}
+                                      checked={false}
+                                      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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_description"
+                              title="description"
+                            >
+                              description
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper ant-input-textarea-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <textarea
+                                    aria-describedby="root_description__error root_description__description root_description__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    disabled={false}
+                                    id="root_description"
+                                    name="root[description]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onMouseDown={[Function]}
+                                    placeholder=""
+                                    rows={4}
+                                    style={
+                                      {
+                                        "resize": undefined,
+                                      }
+                                    }
+                                    type="textarea"
+                                    value=""
+                                  />
+                                  <span
+                                    className="ant-input-suffix"
+                                  >
+                                    <span
+                                      className="ant-input-textarea-suffix"
+                                    />
+                                  </span>
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                                  id="root_tasks"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_tasks__title"
+                                        onClick={[Function]}
+                                        title="tasks"
+                                      >
+                                        tasks
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-object"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <fieldset
+                                                        id="root_tasks_0"
+                                                      >
+                                                        <div
+                                                          className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                          style={
+                                                            {
+                                                              "marginLeft": -12,
+                                                              "marginRight": -12,
+                                                              "rowGap": undefined,
+                                                            }
+                                                          }
+                                                        >
+                                                          <div
+                                                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <label
+                                                              className="ant-form-item-required"
+                                                              htmlFor="root_tasks_0__title"
+                                                              onClick={[Function]}
+                                                              title="tasks-1"
+                                                            >
+                                                              tasks-1
+                                                            </label>
+                                                            <div
+                                                              className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-string"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <label
+                                                                      className=""
+                                                                      htmlFor="root_tasks_0_title"
+                                                                      title="title"
+                                                                    >
+                                                                      title
+                                                                    </label>
+                                                                  </div>
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <span
+                                                                          className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                          onClick={[Function]}
+                                                                          style={
+                                                                            {
+                                                                              "width": "100%",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <input
+                                                                            aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                                                            className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                                            disabled={false}
+                                                                            id="root_tasks_0_title"
+                                                                            name="root.tasks.0.title"
+                                                                            onBlur={[Function]}
+                                                                            onChange={[Function]}
+                                                                            onCompositionEnd={[Function]}
+                                                                            onCompositionStart={[Function]}
+                                                                            onFocus={[Function]}
+                                                                            onKeyDown={[Function]}
+                                                                            onKeyUp={[Function]}
+                                                                            placeholder=""
+                                                                            type="text"
+                                                                            value="Task 1"
+                                                                          />
+                                                                          <span
+                                                                            className="ant-input-suffix"
+                                                                          />
+                                                                        </span>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                          <div
+                                                            className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-boolean"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <label
+                                                                          className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                                          onClick={[Function]}
+                                                                          style={{}}
+                                                                        >
+                                                                          <span
+                                                                            className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                                                          >
+                                                                            <input
+                                                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                                                              autoFocus={false}
+                                                                              checked={false}
+                                                                              className="ant-checkbox-input"
+                                                                              disabled={false}
+                                                                              id="root_tasks_0_done"
+                                                                              name="root.tasks.0.done"
+                                                                              onBlur={[Function]}
+                                                                              onChange={[Function]}
+                                                                              onClick={[Function]}
+                                                                              onFocus={[Function]}
+                                                                              type="checkbox"
+                                                                            />
+                                                                            <span
+                                                                              className="ant-checkbox-inner"
+                                                                            />
+                                                                          </span>
+                                                                          <span
+                                                                            className="ant-checkbox-label"
+                                                                          >
+                                                                            done
+                                                                          </span>
+                                                                        </label>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </fieldset>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__moveUp"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move up"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__moveDown"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move down"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_0__remove"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Remove"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-object"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <fieldset
+                                                        id="root_tasks_1"
+                                                      >
+                                                        <div
+                                                          className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                          style={
+                                                            {
+                                                              "marginLeft": -12,
+                                                              "marginRight": -12,
+                                                              "rowGap": undefined,
+                                                            }
+                                                          }
+                                                        >
+                                                          <div
+                                                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <label
+                                                              className="ant-form-item-required"
+                                                              htmlFor="root_tasks_1__title"
+                                                              onClick={[Function]}
+                                                              title="tasks-2"
+                                                            >
+                                                              tasks-2
+                                                            </label>
+                                                            <div
+                                                              className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-string"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <label
+                                                                      className=""
+                                                                      htmlFor="root_tasks_1_title"
+                                                                      title="title"
+                                                                    >
+                                                                      title
+                                                                    </label>
+                                                                  </div>
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <span
+                                                                          className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                          onClick={[Function]}
+                                                                          style={
+                                                                            {
+                                                                              "width": "100%",
+                                                                            }
+                                                                          }
+                                                                        >
+                                                                          <input
+                                                                            aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                                                            className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                                            disabled={false}
+                                                                            id="root_tasks_1_title"
+                                                                            name="root.tasks.1.title"
+                                                                            onBlur={[Function]}
+                                                                            onChange={[Function]}
+                                                                            onCompositionEnd={[Function]}
+                                                                            onCompositionStart={[Function]}
+                                                                            onFocus={[Function]}
+                                                                            onKeyDown={[Function]}
+                                                                            onKeyUp={[Function]}
+                                                                            placeholder=""
+                                                                            type="text"
+                                                                            value="Task 2"
+                                                                          />
+                                                                          <span
+                                                                            className="ant-input-suffix"
+                                                                          />
+                                                                        </span>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                          <div
+                                                            className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                            style={
+                                                              {
+                                                                "paddingLeft": 12,
+                                                                "paddingRight": 12,
+                                                              }
+                                                            }
+                                                          >
+                                                            <div
+                                                              className="rjsf-field rjsf-field-boolean"
+                                                            >
+                                                              <div
+                                                                className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                              >
+                                                                <div
+                                                                  className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                                  style={
+                                                                    {
+                                                                      "rowGap": undefined,
+                                                                    }
+                                                                  }
+                                                                >
+                                                                  <div
+                                                                    className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                    style={{}}
+                                                                  >
+                                                                    <div
+                                                                      className="ant-form-item-control-input"
+                                                                    >
+                                                                      <div
+                                                                        className="ant-form-item-control-input-content"
+                                                                      >
+                                                                        <label
+                                                                          className="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                                                          onClick={[Function]}
+                                                                          style={{}}
+                                                                        >
+                                                                          <span
+                                                                            className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj ant-checkbox-checked"
+                                                                          >
+                                                                            <input
+                                                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                                                              autoFocus={false}
+                                                                              checked={true}
+                                                                              className="ant-checkbox-input"
+                                                                              disabled={false}
+                                                                              id="root_tasks_1_done"
+                                                                              name="root.tasks.1.done"
+                                                                              onBlur={[Function]}
+                                                                              onChange={[Function]}
+                                                                              onClick={[Function]}
+                                                                              onFocus={[Function]}
+                                                                              type="checkbox"
+                                                                            />
+                                                                            <span
+                                                                              className="ant-checkbox-inner"
+                                                                            />
+                                                                          </span>
+                                                                          <span
+                                                                            className="ant-checkbox-label"
+                                                                          >
+                                                                            done
+                                                                          </span>
+                                                                        </label>
+                                                                      </div>
+                                                                    </div>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </fieldset>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__moveUp"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move up"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__moveDown"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Move down"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks_1__remove"
+                                              onClick={[Function]}
+                                              style={
+                                                {
+                                                  "paddingTop": "4px",
+                                                }
+                                              }
+                                              title="Remove"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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_tasks__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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                  id="root_tags"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_tags__title"
+                                        onClick={[Function]}
+                                        title="tags"
+                                      >
+                                        tags
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_0"
+                                                    title="tags-1"
+                                                  >
+                                                    tags-1
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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="foo"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_1"
+                                                    title="tags-2"
+                                                  >
+                                                    tags-2
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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="bar"
+                                                        />
+                                                        <span
+                                                          className="ant-input-suffix"
+                                                        />
+                                                      </span>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  id="root_person"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_person__title"
+                                        onClick={[Function]}
+                                        title="person"
+                                      >
+                                        person
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_firstName"
+                                                title="firstName"
+                                              >
+                                                firstName
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      disabled={false}
+                                                      id="root_person_firstName"
+                                                      name="root.person.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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_lastName"
+                                                title="lastName"
+                                              >
+                                                lastName
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      disabled={false}
+                                                      id="root_person_lastName"
+                                                      name="root.person.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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-object"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <fieldset
+                                                    id="root_person_address"
+                                                  >
+                                                    <div
+                                                      className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                      style={
+                                                        {
+                                                          "marginLeft": -12,
+                                                          "marginRight": -12,
+                                                          "rowGap": undefined,
+                                                        }
+                                                      }
+                                                    >
+                                                      <div
+                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <label
+                                                          className=""
+                                                          htmlFor="root_person_address__title"
+                                                          onClick={[Function]}
+                                                          title="address"
+                                                        >
+                                                          address
+                                                        </label>
+                                                        <div
+                                                          className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_street"
+                                                                  title="street"
+                                                                >
+                                                                  street
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                      <div
+                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_city"
+                                                                  title="city"
+                                                                >
+                                                                  city
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </fieldset>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </fieldset>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_color"
+                              title="color"
+                            >
+                              color
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  aria-describedby="root_color__error root_color__description root_color__help"
+                                  className="ant-select ant-select-outlined ant-select-in-form-item ant-select-has-feedback css-dev-only-do-not-override-xepvsj ant-select-single ant-select-show-arrow"
+                                  name="root.color"
+                                  onBlur={[Function]}
+                                  onFocus={[Function]}
+                                  onKeyDown={[Function]}
+                                  onKeyUp={[Function]}
+                                  onMouseDown={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-select-selector"
+                                    onClick={[Function]}
+                                    onMouseDown={[Function]}
+                                  >
+                                    <span
+                                      className="ant-select-selection-wrap"
+                                    >
+                                      <span
+                                        className="ant-select-selection-search"
+                                      >
+                                        <input
+                                          aria-autocomplete="list"
+                                          aria-controls="root_color_list"
+                                          aria-describedby="root_color__error root_color__description root_color__help"
+                                          aria-expanded={false}
+                                          aria-haspopup="listbox"
+                                          aria-owns="root_color_list"
+                                          autoComplete="off"
+                                          autoFocus={false}
+                                          className="ant-select-selection-search-input"
+                                          disabled={false}
+                                          id="root_color"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onCompositionEnd={[Function]}
+                                          onCompositionStart={[Function]}
+                                          onKeyDown={[Function]}
+                                          onMouseDown={[Function]}
+                                          onPaste={[Function]}
+                                          readOnly={true}
+                                          role="combobox"
+                                          style={
+                                            {
+                                              "opacity": 0,
+                                            }
+                                          }
+                                          type="search"
+                                          unselectable="on"
+                                          value=""
+                                        />
+                                      </span>
+                                      <span
+                                        className="ant-select-selection-placeholder"
+                                      />
+                                    </span>
+                                  </div>
+                                  <span
+                                    aria-hidden={true}
+                                    className="ant-select-arrow"
+                                    onMouseDown={[Function]}
+                                    style={
+                                      {
+                                        "WebkitUserSelect": "none",
+                                        "userSelect": "none",
+                                      }
+                                    }
+                                    unselectable="on"
+                                  >
+                                    <span
+                                      aria-label="down"
+                                      className="anticon anticon-down ant-select-suffix"
+                                      role="img"
+                                    >
+                                      <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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_firstName"
+                              title="firstName"
+                            >
+                              firstName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_age"
+                              title="age"
+                            >
+                              age
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <label
+                                  className="ant-checkbox-wrapper ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                  onClick={[Function]}
+                                  style={{}}
+                                >
+                                  <span
+                                    className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj"
+                                  >
+                                    <input
+                                      aria-describedby="root_active__error root_active__description root_active__help"
+                                      autoFocus={false}
+                                      checked={false}
+                                      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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/antd/test/__snapshots__/Object.test.tsx.snap b/packages/antd/test/__snapshots__/Object.test.tsx.snap
index dc99af31b8..a2d17214b0 100644
--- a/packages/antd/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/antd/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,4198 @@
 // 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"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  id="root_person"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_person__title"
+                                        onClick={[Function]}
+                                        title="person"
+                                      >
+                                        person
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_name"
+                                                title="name"
+                                              >
+                                                name
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-object"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <fieldset
+                                                    id="root_person_address"
+                                                  >
+                                                    <div
+                                                      className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                      style={
+                                                        {
+                                                          "marginLeft": -12,
+                                                          "marginRight": -12,
+                                                          "rowGap": undefined,
+                                                        }
+                                                      }
+                                                    >
+                                                      <div
+                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <label
+                                                          className=""
+                                                          htmlFor="root_person_address__title"
+                                                          onClick={[Function]}
+                                                          title="address"
+                                                        >
+                                                          address
+                                                        </label>
+                                                        <div
+                                                          className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_street"
+                                                                  title="street"
+                                                                >
+                                                                  street
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                      <div
+                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_city"
+                                                                  title="city"
+                                                                >
+                                                                  city
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                      <div
+                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_country"
+                                                                  title="country"
+                                                                >
+                                                                  country
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </fieldset>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </fieldset>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_name"
+                              title="name"
+                            >
+                              name
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_name__error root_name__description root_name__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                        style={
+                          {
+                            "marginLeft": -12,
+                            "marginRight": -12,
+                            "rowGap": undefined,
+                          }
+                        }
+                      >
+                        <div
+                          className="ant-col form-additional css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "flex": "1",
+                              "paddingLeft": 12,
+                              "paddingRight": 12,
+                            }
+                          }
+                        >
+                          <div
+                            className="form-group"
+                          >
+                            <div
+                              className="ant-form-item form-group css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                            >
+                              <div
+                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                style={
+                                  {
+                                    "rowGap": undefined,
+                                  }
+                                }
+                              >
+                                <div
+                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                  style={{}}
+                                >
+                                  <label
+                                    className=""
+                                    htmlFor="root_customField-key"
+                                    title="customField Key"
+                                  >
+                                    customField Key
+                                  </label>
+                                </div>
+                                <div
+                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                  style={{}}
+                                >
+                                  <div
+                                    className="ant-form-item-control-input"
+                                  >
+                                    <div
+                                      className="ant-form-item-control-input-content"
+                                    >
+                                      <span
+                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined form-control"
+                                        onClick={[Function]}
+                                        style={
+                                          {
+                                            "width": "100%",
+                                          }
+                                        }
+                                      >
+                                        <input
+                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                          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>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="ant-col form-additional css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "flex": "1",
+                              "paddingLeft": 12,
+                              "paddingRight": 12,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                          >
+                            <div
+                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                              style={
+                                {
+                                  "rowGap": undefined,
+                                }
+                              }
+                            >
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <label
+                                  className=""
+                                  htmlFor="root_customField"
+                                  title="customField"
+                                >
+                                  customField
+                                </label>
+                              </div>
+                              <div
+                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                style={{}}
+                              >
+                                <div
+                                  className="ant-form-item-control-input"
+                                >
+                                  <div
+                                    className="ant-form-item-control-input-content"
+                                  >
+                                    <span
+                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                      onClick={[Function]}
+                                      style={
+                                        {
+                                          "width": "100%",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_customField__error root_customField__description root_customField__help"
+                                        className="ant-input css-dev-only-do-not-override-xepvsj"
+                                        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>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "flex": "0 0 192px",
+                              "paddingLeft": 12,
+                              "paddingRight": 12,
+                            }
+                          }
+                        >
+                          <button
+                            className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                          >
+                            <span
+                              className="ant-btn-icon"
+                              style={{}}
+                            >
+                              <span
+                                aria-label="delete"
+                                className="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>
+                <div
+                  className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                  style={{}}
+                >
+                  <div
+                    className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "marginLeft": -12,
+                        "marginRight": -12,
+                        "rowGap": undefined,
+                      }
+                    }
+                  >
+                    <div
+                      className="ant-col css-dev-only-do-not-override-xepvsj"
+                      style={
+                        {
+                          "flex": "0 0 192px",
+                          "paddingLeft": 12,
+                          "paddingRight": 12,
+                        }
+                      }
+                    >
+                      <button
+                        className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                      >
+                        <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>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_name"
+                              title="name"
+                            >
+                              name
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_name__error root_name__description root_name__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_age"
+                              title="age"
+                            >
+                              age
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <label
+                                  className="ant-checkbox-wrapper ant-checkbox-wrapper-checked ant-checkbox-wrapper-in-form-item css-dev-only-do-not-override-xepvsj"
+                                  onClick={[Function]}
+                                  style={{}}
+                                >
+                                  <span
+                                    className="ant-checkbox ant-wave-target css-dev-only-do-not-override-xepvsj ant-checkbox-checked"
+                                  >
+                                    <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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                  id="root_tags"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_tags__title"
+                                        onClick={[Function]}
+                                        title="tags"
+                                      >
+                                        tags
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_0"
+                                                    title="tags-1"
+                                                  >
+                                                    tags-1
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_tags_1"
+                                                    title="tags-2"
+                                                  >
+                                                    tags-2
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_firstName"
+                              title="firstName"
+                            >
+                              firstName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_lastName"
+                              title="lastName"
+                            >
+                              lastName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_age"
+                              title="age"
+                            >
+                              age
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  id="root_person"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_person__title"
+                                        onClick={[Function]}
+                                        title="person"
+                                      >
+                                        person
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <label
+                                                className=""
+                                                htmlFor="root_person_name"
+                                                title="name"
+                                              >
+                                                name
+                                              </label>
+                                            </div>
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <span
+                                                    className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                    onClick={[Function]}
+                                                    style={
+                                                      {
+                                                        "width": "100%",
+                                                      }
+                                                    }
+                                                  >
+                                                    <input
+                                                      aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                                                      className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                      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>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-object"
+                                      >
+                                        <div
+                                          className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                        >
+                                          <div
+                                            className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "rowGap": undefined,
+                                              }
+                                            }
+                                          >
+                                            <div
+                                              className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                              style={{}}
+                                            >
+                                              <div
+                                                className="ant-form-item-control-input"
+                                              >
+                                                <div
+                                                  className="ant-form-item-control-input-content"
+                                                >
+                                                  <fieldset
+                                                    id="root_person_address"
+                                                  >
+                                                    <div
+                                                      className="ant-row css-dev-only-do-not-override-xepvsj"
+                                                      style={
+                                                        {
+                                                          "marginLeft": -12,
+                                                          "marginRight": -12,
+                                                          "rowGap": undefined,
+                                                        }
+                                                      }
+                                                    >
+                                                      <div
+                                                        className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <label
+                                                          className=""
+                                                          htmlFor="root_person_address__title"
+                                                          onClick={[Function]}
+                                                          title="address"
+                                                        >
+                                                          address
+                                                        </label>
+                                                        <div
+                                                          className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_street"
+                                                                  title="street"
+                                                                >
+                                                                  street
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                      <div
+                                                        className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                                        style={
+                                                          {
+                                                            "paddingLeft": 12,
+                                                            "paddingRight": 12,
+                                                          }
+                                                        }
+                                                      >
+                                                        <div
+                                                          className="rjsf-field rjsf-field-string"
+                                                        >
+                                                          <div
+                                                            className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                                          >
+                                                            <div
+                                                              className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                              style={
+                                                                {
+                                                                  "rowGap": undefined,
+                                                                }
+                                                              }
+                                                            >
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <label
+                                                                  className=""
+                                                                  htmlFor="root_person_address_city"
+                                                                  title="city"
+                                                                >
+                                                                  city
+                                                                </label>
+                                                              </div>
+                                                              <div
+                                                                className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                                style={{}}
+                                                              >
+                                                                <div
+                                                                  className="ant-form-item-control-input"
+                                                                >
+                                                                  <div
+                                                                    className="ant-form-item-control-input-content"
+                                                                  >
+                                                                    <span
+                                                                      className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                                      onClick={[Function]}
+                                                                      style={
+                                                                        {
+                                                                          "width": "100%",
+                                                                        }
+                                                                      }
+                                                                    >
+                                                                      <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-xepvsj"
+                                                                        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>
+                                                                  </div>
+                                                                </div>
+                                                              </div>
+                                                            </div>
+                                                          </div>
+                                                        </div>
+                                                      </div>
+                                                    </div>
+                                                  </fieldset>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </fieldset>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_name"
+                              title="name"
+                            >
+                              name
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_name__error root_name__description root_name__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_count"
+                              title="count"
+                            >
+                              count
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <fieldset
+                                  className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                                  id="root_items"
+                                >
+                                  <div
+                                    className="ant-row css-dev-only-do-not-override-xepvsj"
+                                    style={
+                                      {
+                                        "marginLeft": -12,
+                                        "marginRight": -12,
+                                        "rowGap": undefined,
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <label
+                                        className=""
+                                        htmlFor="root_items__title"
+                                        onClick={[Function]}
+                                        title="items"
+                                      >
+                                        items
+                                      </label>
+                                      <div
+                                        className="ant-divider css-dev-only-do-not-override-xepvsj 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-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_items_0"
+                                                    title="items-1"
+                                                  >
+                                                    items-1
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                        className="ant-row ant-row-top css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "1",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="rjsf-field rjsf-field-string"
+                                          >
+                                            <div
+                                              className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                                            >
+                                              <div
+                                                className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                                                style={
+                                                  {
+                                                    "rowGap": undefined,
+                                                  }
+                                                }
+                                              >
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <label
+                                                    className="ant-form-item-required"
+                                                    htmlFor="root_items_1"
+                                                    title="items-2"
+                                                  >
+                                                    items-2
+                                                  </label>
+                                                </div>
+                                                <div
+                                                  className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                                                  style={{}}
+                                                >
+                                                  <div
+                                                    className="ant-form-item-control-input"
+                                                  >
+                                                    <div
+                                                      className="ant-form-item-control-input-content"
+                                                    >
+                                                      <span
+                                                        className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                                        onClick={[Function]}
+                                                        style={
+                                                          {
+                                                            "width": "100%",
+                                                          }
+                                                        }
+                                                      >
+                                                        <input
+                                                          aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                                          className="ant-input css-dev-only-do-not-override-xepvsj"
+                                                          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>
+                                                    </div>
+                                                  </div>
+                                                </div>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <div
+                                            className="ant-space-compact css-dev-only-do-not-override-xepvsj"
+                                            style={
+                                              {
+                                                "width": "100%",
+                                              }
+                                            }
+                                          >
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-up"
+                                                  className="anticon anticon-arrow-up"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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={{}}
+                                              >
+                                                <span
+                                                  aria-label="arrow-down"
+                                                  className="anticon anticon-arrow-down"
+                                                  role="img"
+                                                >
+                                                  <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>
+                                            </button>
+                                            <button
+                                              className="ant-btn css-dev-only-do-not-override-xepvsj 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"
+                                              type="button"
+                                            >
+                                              <span
+                                                className="ant-btn-icon"
+                                                style={{}}
+                                              >
+                                                <span
+                                                  aria-label="delete"
+                                                  className="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
+                                      className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                                      style={
+                                        {
+                                          "paddingLeft": 12,
+                                          "paddingRight": 12,
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="ant-row ant-row-end css-dev-only-do-not-override-xepvsj"
+                                        style={
+                                          {
+                                            "marginLeft": -12,
+                                            "marginRight": -12,
+                                            "rowGap": undefined,
+                                          }
+                                        }
+                                      >
+                                        <div
+                                          className="ant-col css-dev-only-do-not-override-xepvsj"
+                                          style={
+                                            {
+                                              "flex": "0 0 192px",
+                                              "paddingLeft": 12,
+                                              "paddingRight": 12,
+                                            }
+                                          }
+                                        >
+                                          <button
+                                            className="ant-btn css-dev-only-do-not-override-xepvsj 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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+    >
+      <div
+        className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+        style={
+          {
+            "rowGap": undefined,
+          }
+        }
+      >
+        <div
+          className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+          style={{}}
+        >
+          <div
+            className="ant-form-item-control-input"
+          >
+            <div
+              className="ant-form-item-control-input-content"
+            >
+              <fieldset
+                id="root"
+              >
+                <div
+                  className="ant-row css-dev-only-do-not-override-xepvsj"
+                  style={
+                    {
+                      "marginLeft": -12,
+                      "marginRight": -12,
+                      "rowGap": undefined,
+                    }
+                  }
+                >
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_firstName"
+                              title="firstName"
+                            >
+                              firstName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_lastName"
+                              title="lastName"
+                            >
+                              lastName
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <span
+                                  className="ant-input-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-outlined"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <input
+                                    aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                                    className="ant-input css-dev-only-do-not-override-xepvsj"
+                                    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>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="ant-col ant-col-24 css-dev-only-do-not-override-xepvsj"
+                    style={
+                      {
+                        "paddingLeft": 12,
+                        "paddingRight": 12,
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="ant-form-item css-dev-only-do-not-override-xepvsj ant-form-item-horizontal"
+                      >
+                        <div
+                          className="ant-row ant-form-item-row css-dev-only-do-not-override-xepvsj"
+                          style={
+                            {
+                              "rowGap": undefined,
+                            }
+                          }
+                        >
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-label css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <label
+                              className=""
+                              htmlFor="root_age"
+                              title="age"
+                            >
+                              age
+                            </label>
+                          </div>
+                          <div
+                            className="ant-col ant-col-24 ant-form-item-control css-dev-only-do-not-override-xepvsj"
+                            style={{}}
+                          >
+                            <div
+                              className="ant-form-item-control-input"
+                            >
+                              <div
+                                className="ant-form-item-control-input-content"
+                              >
+                                <div
+                                  className="ant-input-number-affix-wrapper css-dev-only-do-not-override-xepvsj ant-input-number-outlined ant-input-number-has-feedback"
+                                  onClick={[Function]}
+                                  style={
+                                    {
+                                      "width": "100%",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="ant-input-number ant-input-number-in-form-item css-dev-only-do-not-override-xepvsj"
+                                    onBeforeInput={[Function]}
+                                    onBlur={[Function]}
+                                    onCompositionEnd={[Function]}
+                                    onCompositionStart={[Function]}
+                                    onFocus={[Function]}
+                                    onKeyDown={[Function]}
+                                    onKeyUp={[Function]}
+                                  >
+                                    <div
+                                      className="ant-input-number-handler-wrap"
+                                    >
+                                      <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"
+                                      >
+                                        <span
+                                          aria-label="up"
+                                          className="anticon anticon-up ant-input-number-handler-up-inner"
+                                          role="img"
+                                        >
+                                          <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
+                                        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"
+                                        >
+                                          <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>
+                                    </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>
+                                  <span
+                                    className="ant-input-number-suffix"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ant-btn css-dev-only-do-not-override-xepvsj ant-btn-submit"
+    disabled={false}
+    onClick={[Function]}
+    style={{}}
+    type="submit"
+  >
+    <span>
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/chakra-ui/test/__snapshots__/Array.test.tsx.snap b/packages/chakra-ui/test/__snapshots__/Array.test.tsx.snap
index 0f0f9af000..e4bcf149d6 100644
--- a/packages/chakra-ui/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/chakra-ui/test/__snapshots__/Array.test.tsx.snap
@@ -3298,6 +3298,6065 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-7 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-10 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-11:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-12:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-12:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-18 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-18 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-18>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-18>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-18>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-19 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-19:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-19 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-19:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-19:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-19 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-41 {
+  justify-self: flex-end;
+}
+
+.emotion-42 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-43 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-43:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-43:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-43 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-43:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-43:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-44 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r2k:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r2l:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="emotion-7"
+                        >
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r2m:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r2n:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r2n:"
+                                      id="field:::r2n:::label"
+                                    >
+                                      name
+                                    </label>
+                                    <input
+                                      aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_0_name"
+                                      name="root[0][name]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r2o:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r2p:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r2p:"
+                                      id="field:::r2p:::label"
+                                    >
+                                      value
+                                    </label>
+                                    <input
+                                      aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_0_value"
+                                      name="root[0][value]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-18"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-19"
+                      disabled={true}
+                      id="root_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-19"
+                      disabled={false}
+                      id="root_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-19"
+                      disabled={false}
+                      id="root_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r2q:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="emotion-7"
+                        >
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r2r:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r2s:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r2s:"
+                                      id="field:::r2s:::label"
+                                    >
+                                      name
+                                    </label>
+                                    <input
+                                      aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_1_name"
+                                      name="root[1][name]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r2t:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r2u:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r2u:"
+                                      id="field:::r2u:::label"
+                                    >
+                                      value
+                                    </label>
+                                    <input
+                                      aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_1_value"
+                                      name="root[1][value]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-18"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-19"
+                      disabled={false}
+                      id="root_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-19"
+                      disabled={true}
+                      id="root_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-19"
+                      disabled={false}
+                      id="root_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="emotion-41"
+            >
+              <div
+                className="emotion-42"
+              >
+                <button
+                  className="chakra-button rjsf-array-item-add emotion-43"
+                  disabled={false}
+                  id="root__add"
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-plus"
+                    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="M5 12h14"
+                    />
+                    <path
+                      d="M12 5v14"
+                    />
+                  </svg>
+                  Add Item
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-44"
+  >
+    <button
+      className="chakra-button emotion-43"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-7 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-8:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-8:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-8:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-9 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-9 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-9>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-9>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-9>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-10 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-10:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-10:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-10 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-10:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-10:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-10 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-23 {
+  justify-self: flex-end;
+}
+
+.emotion-24 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-25 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-25:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-25:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-25 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-25:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-25:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-26 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r2f:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r2g:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r2h:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-9"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-10"
+                      disabled={true}
+                      id="root_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-10"
+                      disabled={false}
+                      id="root_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-10"
+                      disabled={false}
+                      id="root_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r2i:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r2j:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-9"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-10"
+                      disabled={false}
+                      id="root_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-10"
+                      disabled={true}
+                      id="root_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-10"
+                      disabled={false}
+                      id="root_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="emotion-23"
+            >
+              <div
+                className="emotion-24"
+              >
+                <button
+                  className="chakra-button rjsf-array-item-add emotion-25"
+                  disabled={false}
+                  id="root__add"
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-plus"
+                    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="M5 12h14"
+                    />
+                    <path
+                      d="M12 5v14"
+                    />
+                  </svg>
+                  Add Item
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-26"
+  >
+    <button
+      className="chakra-button emotion-25"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  margin-bottom: var(--chakra-spacing-1);
+  position: relative;
+}
+
+@layer recipes {
+  .emotion-2 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-3 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    gap: var(--chakra-spacing-1\\.5);
+    width: var(--chakra-sizes-full);
+    --select-trigger-height: var(--chakra-sizes-10);
+    --select-trigger-padding-x: var(--chakra-spacing-3);
+  }
+}
+
+@layer recipes {
+  .emotion-4 {
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    width: var(--chakra-sizes-full);
+    min-height: var(--select-trigger-height);
+    --input-height: var(--select-trigger-height);
+    padding-inline: var(--select-trigger-padding-x);
+    border-radius: var(--chakra-radii-l2);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    text-align: start;
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+  }
+
+  .emotion-6:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+
+  .emotion-6:is(:placeholder-shown, [data-placeholder-shown]) {
+    --mix-color: color-mix(in srgb, var(--chakra-colors-fg-muted) 80%, transparent);
+    color: var(--mix-color, var(--chakra-colors-fg-muted));
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-6:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-6:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    border-color: var(--chakra-colors-border-emphasized);
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    text-wrap: wrap;
+    max-width: 80%;
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-1);
+    position: absolute;
+    inset-inline-end: 0;
+    top: 0;
+    bottom: 0;
+    padding-inline: var(--select-trigger-padding-x);
+    pointer-events: none;
+  }
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    color: var(--chakra-colors-fg-muted);
+  }
+
+  .emotion-9:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    color: var(--chakra-colors-fg-subtle);
+  }
+
+  .emotion-9:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    color: var(--chakra-colors-fg-error);
+  }
+
+  .emotion-9 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+.emotion-10 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 2;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.emotion-11 {
+  min-width: 100%!important;
+  z-index: 2!important;
+  top: calc(100% + 5px)!important;
+}
+
+@layer recipes {
+  .emotion-12 {
+    background: var(--chakra-colors-bg-panel);
+    --bg-currentcolor: var(--chakra-colors-bg-panel);
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    z-index: var(--chakra-z-index-dropdown);
+    border-radius: var(--chakra-radii-l2);
+    outline: 0;
+    max-height: var(--chakra-sizes-96);
+    overflow-y: auto;
+    box-shadow: var(--chakra-shadows-md);
+    padding: var(--chakra-spacing-1);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-12:is([open], [data-open], [data-state=open]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fast);
+    animation-duration: var(--chakra-durations-fast);
+  }
+
+  .emotion-12:is([open], [data-open], [data-state=open])[data-placement^=top] {
+    -webkit-animation-name: slide-from-bottom,fade-in;
+    animation-name: slide-from-bottom,fade-in;
+  }
+
+  .emotion-12:is([open], [data-open], [data-state=open])[data-placement^=bottom] {
+    -webkit-animation-name: slide-from-top,fade-in;
+    animation-name: slide-from-top,fade-in;
+  }
+
+  .emotion-12:is([open], [data-open], [data-state=open])[data-placement^=left] {
+    -webkit-animation-name: slide-from-right,fade-in;
+    animation-name: slide-from-right,fade-in;
+  }
+
+  .emotion-12:is([open], [data-open], [data-state=open])[data-placement^=right] {
+    -webkit-animation-name: slide-from-left,fade-in;
+    animation-name: slide-from-left,fade-in;
+  }
+
+  .emotion-12:is([closed], [data-closed], [data-state=closed]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fastest);
+    animation-duration: var(--chakra-durations-fastest);
+  }
+
+  .emotion-12:is([closed], [data-closed], [data-state=closed])[data-placement^=top] {
+    -webkit-animation-name: slide-to-bottom,fade-out;
+    animation-name: slide-to-bottom,fade-out;
+  }
+
+  .emotion-12:is([closed], [data-closed], [data-state=closed])[data-placement^=bottom] {
+    -webkit-animation-name: slide-to-top,fade-out;
+    animation-name: slide-to-top,fade-out;
+  }
+
+  .emotion-12:is([closed], [data-closed], [data-state=closed])[data-placement^=left] {
+    -webkit-animation-name: slide-to-right,fade-out;
+    animation-name: slide-to-right,fade-out;
+  }
+
+  .emotion-12:is([closed], [data-closed], [data-state=closed])[data-placement^=right] {
+    -webkit-animation-name: slide-to-left,fade-out;
+    animation-name: slide-to-left,fade-out;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    position: relative;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-2);
+    cursor: var(--chakra-cursor-option);
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    text-align: start;
+    border-radius: var(--chakra-radii-l1);
+    padding-block: var(--chakra-spacing-1\\.5);
+    padding-inline: var(--chakra-spacing-2);
+  }
+
+  .emotion-13[data-highlighted] {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-bg-emphasized) 60%, transparent);
+    background: var(--mix-background, var(--chakra-colors-bg-emphasized));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-bg-emphasized));
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  .emotion-13 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+@layer recipes {
+  .emotion-14 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+  }
+}
+
+.emotion-22 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-23 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-23:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-23:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-23 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-23:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-23:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r3i:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="chakra-field__root emotion-2"
+          data-part="root"
+          data-scope="field"
+          id="field:::r3j:"
+          role="group"
+        >
+          <div
+            aria-describedby="root__error root__description root__help"
+            autoFocus={false}
+            className="chakra-select__root emotion-3"
+            data-part="root"
+            data-scope="select"
+            dir="ltr"
+            id="select:root"
+            onBlur={[Function]}
+            onFocus={[Function]}
+          >
+            <select
+              aria-hidden={true}
+              aria-labelledby="field:::r3j:::label"
+              defaultValue={[]}
+              disabled={false}
+              id=":r3j:"
+              multiple={true}
+              name="root"
+              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",
+                }
+              }
+              tabIndex={-1}
+            >
+              <option
+                value=""
+              />
+              <option
+                disabled={false}
+                value="0"
+              >
+                foo
+              </option>
+              <option
+                disabled={false}
+                value="1"
+              >
+                bar
+              </option>
+              <option
+                disabled={false}
+                value="2"
+              >
+                baz
+              </option>
+            </select>
+            <div
+              className="chakra-select__control emotion-4"
+              data-part="control"
+              data-scope="select"
+              data-state="closed"
+              dir="ltr"
+              id="select:root:control"
+            >
+              <div
+                className="chakra-select__control emotion-4"
+                data-part="control"
+                data-scope="select"
+                data-state="closed"
+                dir="ltr"
+                id="select:root:control"
+              >
+                <button
+                  aria-controls="select:root:content"
+                  aria-expanded={false}
+                  aria-haspopup="listbox"
+                  aria-invalid={false}
+                  aria-labelledby="field:::r3j:::label"
+                  className="chakra-select__trigger emotion-6"
+                  data-part="trigger"
+                  data-placeholder-shown=""
+                  data-scope="select"
+                  data-state="closed"
+                  dir="ltr"
+                  disabled={false}
+                  id="select:root:trigger"
+                  onBlur={[Function]}
+                  onClick={[Function]}
+                  onFocus={[Function]}
+                  onKeyDown={[Function]}
+                  role="combobox"
+                  type="button"
+                >
+                  <span
+                    className="chakra-select__valueText emotion-7"
+                    data-part="value-text"
+                    data-scope="select"
+                    dir="ltr"
+                  />
+                </button>
+                <div
+                  className="chakra-select__indicatorGroup emotion-8"
+                >
+                  <div
+                    aria-hidden={true}
+                    className="chakra-select__indicator emotion-9"
+                    data-part="indicator"
+                    data-scope="select"
+                    data-state="closed"
+                    dir="ltr"
+                  >
+                    <svg
+                      className="emotion-10"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="m6 9 6 6 6-6"
+                      />
+                    </svg>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="chakra-select__positioner emotion-11"
+              data-part="positioner"
+              data-scope="select"
+              dir="ltr"
+              id="select:root:positioner"
+              style={
+                {
+                  "isolation": "isolate",
+                  "left": "0px",
+                  "maxHeight": undefined,
+                  "maxWidth": undefined,
+                  "minWidth": undefined,
+                  "pointerEvents": "none",
+                  "position": "absolute",
+                  "top": "0px",
+                  "transform": "translate3d(0, -100vh, 0)",
+                  "width": "var(--reference-width)",
+                  "zIndex": "var(--z-index)",
+                }
+              }
+            >
+              <div
+                aria-labelledby="field:::r3j:::label"
+                aria-multiselectable={true}
+                className="chakra-select__content emotion-12"
+                data-part="content"
+                data-scope="select"
+                data-state="closed"
+                dir="ltr"
+                hidden={true}
+                id="select:root:content"
+                onKeyDown={[Function]}
+                role="listbox"
+                tabIndex={0}
+              >
+                <div
+                  aria-selected={false}
+                  className="chakra-select__item emotion-13"
+                  data-part="item"
+                  data-scope="select"
+                  data-state="unchecked"
+                  data-value="0"
+                  dir="ltr"
+                  id="select:root:option:0"
+                  onClick={[Function]}
+                  onPointerLeave={[Function]}
+                  onPointerMove={[Function]}
+                  role="option"
+                >
+                  foo
+                  <div
+                    aria-hidden={true}
+                    className="chakra-select__itemIndicator emotion-14"
+                    data-part="item-indicator"
+                    data-scope="select"
+                    data-state="unchecked"
+                    hidden={true}
+                  >
+                    <svg
+                      className="emotion-10"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M20 6 9 17l-5-5"
+                      />
+                    </svg>
+                  </div>
+                </div>
+                <div
+                  aria-selected={false}
+                  className="chakra-select__item emotion-13"
+                  data-part="item"
+                  data-scope="select"
+                  data-state="unchecked"
+                  data-value="1"
+                  dir="ltr"
+                  id="select:root:option:1"
+                  onClick={[Function]}
+                  onPointerLeave={[Function]}
+                  onPointerMove={[Function]}
+                  role="option"
+                >
+                  bar
+                  <div
+                    aria-hidden={true}
+                    className="chakra-select__itemIndicator emotion-14"
+                    data-part="item-indicator"
+                    data-scope="select"
+                    data-state="unchecked"
+                    hidden={true}
+                  >
+                    <svg
+                      className="emotion-10"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M20 6 9 17l-5-5"
+                      />
+                    </svg>
+                  </div>
+                </div>
+                <div
+                  aria-selected={false}
+                  className="chakra-select__item emotion-13"
+                  data-part="item"
+                  data-scope="select"
+                  data-state="unchecked"
+                  data-value="2"
+                  dir="ltr"
+                  id="select:root:option:2"
+                  onClick={[Function]}
+                  onPointerLeave={[Function]}
+                  onPointerMove={[Function]}
+                  role="option"
+                >
+                  baz
+                  <div
+                    aria-hidden={true}
+                    className="chakra-select__itemIndicator emotion-14"
+                    data-part="item-indicator"
+                    data-scope="select"
+                    data-state="unchecked"
+                    hidden={true}
+                  >
+                    <svg
+                      className="emotion-10"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M20 6 9 17l-5-5"
+                      />
+                    </svg>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-22"
+  >
+    <button
+      className="chakra-button emotion-23"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-7 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-8:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-8:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-8:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-20 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-21 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-21 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-21:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-21:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-22 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.emotion-23 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-24 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-24:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-24:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-24 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-24:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-24:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r2v:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r30:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r31:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="text"
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-number"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r32:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r33:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            step="any"
+                            type="number"
+                            value={42}
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-boolean"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r34:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r35:"
+                          role="group"
+                        >
+                          <label
+                            aria-describedby="root_2__error root_2__description root_2__help"
+                            className="chakra-checkbox__root emotion-20"
+                            data-part="root"
+                            data-scope="checkbox"
+                            data-state="checked"
+                            dir="ltr"
+                            htmlFor=":r35:"
+                            id="checkbox:root_2"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              aria-labelledby="field:::r35:::label"
+                              defaultChecked={true}
+                              disabled={false}
+                              id=":r35:"
+                              name="root[2]"
+                              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",
+                                }
+                              }
+                              type="checkbox"
+                              value="on"
+                            />
+                            <div
+                              aria-hidden={true}
+                              className="chakra-checkbox__control emotion-21"
+                              data-part="control"
+                              data-scope="checkbox"
+                              data-state="checked"
+                              dir="ltr"
+                              id="checkbox:root_2:control"
+                            >
+                              <svg
+                                className="emotion-22"
+                                data-state="checked"
+                                viewBox="0 0 24 24"
+                              >
+                                <polyline
+                                  points="20 6 9 17 4 12"
+                                />
+                              </svg>
+                            </div>
+                          </label>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-23"
+  >
+    <button
+      className="chakra-button emotion-24"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-12 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-14 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-14 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-14 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-14>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-14>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-14>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-15 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-15 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-15:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-15:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-15 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-15:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-15:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-15 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-28 {
+  justify-self: flex-end;
+}
+
+.emotion-29 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-30 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-30:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-30:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-30 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-30:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-30:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-70 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r37:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r38:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div>
+                          <div
+                            className="emotion-2"
+                          >
+                            <div>
+                              <div
+                                className="chakra-stack emotion-3"
+                              >
+                                <div
+                                  className="emotion-4"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <fieldset
+                                      aria-labelledby="fieldset:::r39:::legend"
+                                      className="fieldset__root emotion-0"
+                                      data-part="root"
+                                      data-scope="fieldset"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="fieldset__content emotion-1"
+                                      >
+                                        <div
+                                          className="chakra-field__root emotion-12"
+                                          data-part="root"
+                                          data-scope="field"
+                                          id="field:::r3a:"
+                                          role="group"
+                                        >
+                                          <input
+                                            aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                            autoFocus={false}
+                                            className="chakra-input emotion-13"
+                                            data-part="input"
+                                            data-required=""
+                                            data-scope="field"
+                                            disabled={false}
+                                            id="root_0_0"
+                                            name="root[0][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="a"
+                                          />
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                                <div>
+                                  <div
+                                    className="chakra-group emotion-14"
+                                  >
+                                    <button
+                                      aria-label="Move up"
+                                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                                      disabled={true}
+                                      id="root_0_0__moveUp"
+                                      onClick={[Function]}
+                                      title="Move up"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-up"
+                                        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="m5 12 7-7 7 7"
+                                        />
+                                        <path
+                                          d="M12 19V5"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Move down"
+                                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                                      disabled={false}
+                                      id="root_0_0__moveDown"
+                                      onClick={[Function]}
+                                      title="Move down"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-down"
+                                        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="M12 5v14"
+                                        />
+                                        <path
+                                          d="m19 12-7 7-7-7"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Remove"
+                                      className="chakra-button rjsf-array-item-remove emotion-15"
+                                      disabled={false}
+                                      id="root_0_0__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-delete"
+                                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                        />
+                                        <path
+                                          d="m12 9 6 6"
+                                        />
+                                        <path
+                                          d="m18 9-6 6"
+                                        />
+                                      </svg>
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="chakra-stack emotion-3"
+                              >
+                                <div
+                                  className="emotion-4"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <fieldset
+                                      aria-labelledby="fieldset:::r3b:::legend"
+                                      className="fieldset__root emotion-0"
+                                      data-part="root"
+                                      data-scope="fieldset"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="fieldset__content emotion-1"
+                                      >
+                                        <div
+                                          className="chakra-field__root emotion-12"
+                                          data-part="root"
+                                          data-scope="field"
+                                          id="field:::r3c:"
+                                          role="group"
+                                        >
+                                          <input
+                                            aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                            autoFocus={false}
+                                            className="chakra-input emotion-13"
+                                            data-part="input"
+                                            data-required=""
+                                            data-scope="field"
+                                            disabled={false}
+                                            id="root_0_1"
+                                            name="root[0][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="b"
+                                          />
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                                <div>
+                                  <div
+                                    className="chakra-group emotion-14"
+                                  >
+                                    <button
+                                      aria-label="Move up"
+                                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                                      disabled={false}
+                                      id="root_0_1__moveUp"
+                                      onClick={[Function]}
+                                      title="Move up"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-up"
+                                        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="m5 12 7-7 7 7"
+                                        />
+                                        <path
+                                          d="M12 19V5"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Move down"
+                                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                                      disabled={true}
+                                      id="root_0_1__moveDown"
+                                      onClick={[Function]}
+                                      title="Move down"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-down"
+                                        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="M12 5v14"
+                                        />
+                                        <path
+                                          d="m19 12-7 7-7-7"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Remove"
+                                      className="chakra-button rjsf-array-item-remove emotion-15"
+                                      disabled={false}
+                                      id="root_0_1__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-delete"
+                                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                        />
+                                        <path
+                                          d="m12 9 6 6"
+                                        />
+                                        <path
+                                          d="m18 9-6 6"
+                                        />
+                                      </svg>
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="emotion-28"
+                            >
+                              <div
+                                className="emotion-29"
+                              >
+                                <button
+                                  className="chakra-button rjsf-array-item-add emotion-30"
+                                  disabled={false}
+                                  id="root_0__add"
+                                  onClick={[Function]}
+                                  type="button"
+                                >
+                                  <svg
+                                    aria-hidden="true"
+                                    className="lucide lucide-plus"
+                                    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="M5 12h14"
+                                    />
+                                    <path
+                                      d="M12 5v14"
+                                    />
+                                  </svg>
+                                  Add Item
+                                </button>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-14"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                      disabled={true}
+                      id="root_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                      disabled={false}
+                      id="root_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-15"
+                      disabled={false}
+                      id="root_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r3d:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div>
+                          <div
+                            className="emotion-2"
+                          >
+                            <div>
+                              <div
+                                className="chakra-stack emotion-3"
+                              >
+                                <div
+                                  className="emotion-4"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <fieldset
+                                      aria-labelledby="fieldset:::r3e:::legend"
+                                      className="fieldset__root emotion-0"
+                                      data-part="root"
+                                      data-scope="fieldset"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="fieldset__content emotion-1"
+                                      >
+                                        <div
+                                          className="chakra-field__root emotion-12"
+                                          data-part="root"
+                                          data-scope="field"
+                                          id="field:::r3f:"
+                                          role="group"
+                                        >
+                                          <input
+                                            aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                            autoFocus={false}
+                                            className="chakra-input emotion-13"
+                                            data-part="input"
+                                            data-required=""
+                                            data-scope="field"
+                                            disabled={false}
+                                            id="root_1_0"
+                                            name="root[1][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="c"
+                                          />
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                                <div>
+                                  <div
+                                    className="chakra-group emotion-14"
+                                  >
+                                    <button
+                                      aria-label="Move up"
+                                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                                      disabled={true}
+                                      id="root_1_0__moveUp"
+                                      onClick={[Function]}
+                                      title="Move up"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-up"
+                                        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="m5 12 7-7 7 7"
+                                        />
+                                        <path
+                                          d="M12 19V5"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Move down"
+                                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                                      disabled={false}
+                                      id="root_1_0__moveDown"
+                                      onClick={[Function]}
+                                      title="Move down"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-down"
+                                        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="M12 5v14"
+                                        />
+                                        <path
+                                          d="m19 12-7 7-7-7"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Remove"
+                                      className="chakra-button rjsf-array-item-remove emotion-15"
+                                      disabled={false}
+                                      id="root_1_0__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-delete"
+                                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                        />
+                                        <path
+                                          d="m12 9 6 6"
+                                        />
+                                        <path
+                                          d="m18 9-6 6"
+                                        />
+                                      </svg>
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="chakra-stack emotion-3"
+                              >
+                                <div
+                                  className="emotion-4"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <fieldset
+                                      aria-labelledby="fieldset:::r3g:::legend"
+                                      className="fieldset__root emotion-0"
+                                      data-part="root"
+                                      data-scope="fieldset"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="fieldset__content emotion-1"
+                                      >
+                                        <div
+                                          className="chakra-field__root emotion-12"
+                                          data-part="root"
+                                          data-scope="field"
+                                          id="field:::r3h:"
+                                          role="group"
+                                        >
+                                          <input
+                                            aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                            autoFocus={false}
+                                            className="chakra-input emotion-13"
+                                            data-part="input"
+                                            data-required=""
+                                            data-scope="field"
+                                            disabled={false}
+                                            id="root_1_1"
+                                            name="root[1][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="d"
+                                          />
+                                        </div>
+                                      </div>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                                <div>
+                                  <div
+                                    className="chakra-group emotion-14"
+                                  >
+                                    <button
+                                      aria-label="Move up"
+                                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                                      disabled={false}
+                                      id="root_1_1__moveUp"
+                                      onClick={[Function]}
+                                      title="Move up"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-up"
+                                        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="m5 12 7-7 7 7"
+                                        />
+                                        <path
+                                          d="M12 19V5"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Move down"
+                                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                                      disabled={true}
+                                      id="root_1_1__moveDown"
+                                      onClick={[Function]}
+                                      title="Move down"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-arrow-down"
+                                        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="M12 5v14"
+                                        />
+                                        <path
+                                          d="m19 12-7 7-7-7"
+                                        />
+                                      </svg>
+                                    </button>
+                                    <button
+                                      aria-label="Remove"
+                                      className="chakra-button rjsf-array-item-remove emotion-15"
+                                      disabled={false}
+                                      id="root_1_1__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                      type="button"
+                                    >
+                                      <svg
+                                        aria-hidden="true"
+                                        className="lucide lucide-delete"
+                                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                        />
+                                        <path
+                                          d="m12 9 6 6"
+                                        />
+                                        <path
+                                          d="m18 9-6 6"
+                                        />
+                                      </svg>
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="emotion-28"
+                            >
+                              <div
+                                className="emotion-29"
+                              >
+                                <button
+                                  className="chakra-button rjsf-array-item-add emotion-30"
+                                  disabled={false}
+                                  id="root_1__add"
+                                  onClick={[Function]}
+                                  type="button"
+                                >
+                                  <svg
+                                    aria-hidden="true"
+                                    className="lucide lucide-plus"
+                                    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="M5 12h14"
+                                    />
+                                    <path
+                                      d="M12 5v14"
+                                    />
+                                  </svg>
+                                  Add Item
+                                </button>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-14"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-15"
+                      disabled={false}
+                      id="root_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-15"
+                      disabled={true}
+                      id="root_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-15"
+                      disabled={false}
+                      id="root_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="emotion-28"
+            >
+              <div
+                className="emotion-29"
+              >
+                <button
+                  className="chakra-button rjsf-array-item-add emotion-30"
+                  disabled={false}
+                  id="root__add"
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-plus"
+                    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="M5 12h14"
+                    />
+                    <path
+                      d="M12 5v14"
+                    />
+                  </svg>
+                  Add Item
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-70"
+  >
+    <button
+      className="chakra-button emotion-30"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-7 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-10 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-11:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-12:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-12:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-18 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-18 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-18>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-18>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-18>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-19 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-19:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-19 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-19:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-19:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-19 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-41 {
+  justify-self: flex-end;
+}
+
+.emotion-42 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-43 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-43:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-43:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-43 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-43:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-43:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-44 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r3q:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r3r:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="emotion-7"
+                        >
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r3s:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r3t:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r3t:"
+                                      id="field:::r3t:::label"
+                                    >
+                                      name
+                                    </label>
+                                    <input
+                                      aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_0_name"
+                                      name="root.0.name"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r3u:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r3v:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r3v:"
+                                      id="field:::r3v:::label"
+                                    >
+                                      value
+                                    </label>
+                                    <input
+                                      aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_0_value"
+                                      name="root.0.value"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-18"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-19"
+                      disabled={true}
+                      id="root_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-19"
+                      disabled={false}
+                      id="root_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-19"
+                      disabled={false}
+                      id="root_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r40:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="emotion-7"
+                        >
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r41:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r42:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r42:"
+                                      id="field:::r42:::label"
+                                    >
+                                      name
+                                    </label>
+                                    <input
+                                      aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_1_name"
+                                      name="root.1.name"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r43:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-10"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r44:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-11"
+                                      data-part="label"
+                                      data-scope="field"
+                                      htmlFor=":r44:"
+                                      id="field:::r44:::label"
+                                    >
+                                      value
+                                    </label>
+                                    <input
+                                      aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-12"
+                                      data-part="input"
+                                      data-scope="field"
+                                      disabled={false}
+                                      id="root_1_value"
+                                      name="root.1.value"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-18"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-19"
+                      disabled={false}
+                      id="root_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-19"
+                      disabled={true}
+                      id="root_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-19"
+                      disabled={false}
+                      id="root_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="emotion-41"
+            >
+              <div
+                className="emotion-42"
+              >
+                <button
+                  className="chakra-button rjsf-array-item-add emotion-43"
+                  disabled={false}
+                  id="root__add"
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-plus"
+                    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="M5 12h14"
+                    />
+                    <path
+                      d="M12 5v14"
+                    />
+                  </svg>
+                  Add Item
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-44"
+  >
+    <button
+      className="chakra-button emotion-43"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+}
+
+.emotion-3 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-4 {
+  width: 100%;
+}
+
+.emotion-7 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-8:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-8:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-8:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-9 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-9 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-9>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-9>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-9>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-10 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-10:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-10:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-10 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-10:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-10:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-10 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-23 {
+  justify-self: flex-end;
+}
+
+.emotion-24 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-25 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-25:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-25:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-25 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-25:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-25:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-26 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r3l:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div>
+          <div
+            className="emotion-2"
+          >
+            <div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r3m:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r3n:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_0"
+                            name="root.0"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-9"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-10"
+                      disabled={true}
+                      id="root_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-10"
+                      disabled={false}
+                      id="root_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-10"
+                      disabled={false}
+                      id="root_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="chakra-stack emotion-3"
+              >
+                <div
+                  className="emotion-4"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <fieldset
+                      aria-labelledby="fieldset:::r3o:::legend"
+                      className="fieldset__root emotion-0"
+                      data-part="root"
+                      data-scope="fieldset"
+                      disabled={false}
+                    >
+                      <div
+                        className="fieldset__content emotion-1"
+                      >
+                        <div
+                          className="chakra-field__root emotion-7"
+                          data-part="root"
+                          data-scope="field"
+                          id="field:::r3p:"
+                          role="group"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            className="chakra-input emotion-8"
+                            data-part="input"
+                            data-required=""
+                            data-scope="field"
+                            disabled={false}
+                            id="root_1"
+                            name="root.1"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </fieldset>
+                  </div>
+                </div>
+                <div>
+                  <div
+                    className="chakra-group emotion-9"
+                  >
+                    <button
+                      aria-label="Move up"
+                      className="chakra-button rjsf-array-item-move-up emotion-10"
+                      disabled={false}
+                      id="root_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-up"
+                        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="m5 12 7-7 7 7"
+                        />
+                        <path
+                          d="M12 19V5"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Move down"
+                      className="chakra-button rjsf-array-item-move-down emotion-10"
+                      disabled={true}
+                      id="root_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-arrow-down"
+                        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="M12 5v14"
+                        />
+                        <path
+                          d="m19 12-7 7-7-7"
+                        />
+                      </svg>
+                    </button>
+                    <button
+                      aria-label="Remove"
+                      className="chakra-button rjsf-array-item-remove emotion-10"
+                      disabled={false}
+                      id="root_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-delete"
+                        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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                        />
+                        <path
+                          d="m12 9 6 6"
+                        />
+                        <path
+                          d="m18 9-6 6"
+                        />
+                      </svg>
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="emotion-23"
+            >
+              <div
+                className="emotion-24"
+              >
+                <button
+                  className="chakra-button rjsf-array-item-add emotion-25"
+                  disabled={false}
+                  id="root__add"
+                  onClick={[Function]}
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-plus"
+                    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="M5 12h14"
+                    />
+                    <path
+                      d="M12 5v14"
+                    />
+                  </svg>
+                  Add Item
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-26"
+  >
+    <button
+      className="chakra-button emotion-25"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 @layer recipes {
   .emotion-0 {
diff --git a/packages/chakra-ui/test/__snapshots__/Form.test.tsx.snap b/packages/chakra-ui/test/__snapshots__/Form.test.tsx.snap
index fdec33e79a..30f01be6ce 100644
--- a/packages/chakra-ui/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/chakra-ui/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,9572 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-8 {
+  display: grid;
+}
+
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-10 {
+  width: 100%;
+}
+
+.emotion-19 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-20 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-20:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-21 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-21:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-25 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-26 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-26:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-26 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-26:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-26:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-26:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-27 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-28 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-28:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-29 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-29 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-29 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-29>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-29>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-29>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-30 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-30 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-30:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-30:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-30 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-30:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-30:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-30 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-57 {
+  justify-self: flex-end;
+}
+
+.emotion-58 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-59 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-59:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-59:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-59 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-59:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-59:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-60 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r86:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r87:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-5"
+                      id="root_tasks__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-6"
+                      >
+                        tasks
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-7"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-8"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r88:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="emotion-5"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5
+                                      className="chakra-heading emotion-6"
+                                    >
+                                      tasks-1
+                                    </h5>
+                                    <span
+                                      aria-orientation="horizontal"
+                                      className="chakra-separator emotion-7"
+                                      role="separator"
+                                    />
+                                  </div>
+                                  <div
+                                    className="emotion-2"
+                                  >
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::r89:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::r8a:"
+                                              role="group"
+                                            >
+                                              <label
+                                                className="chakra-field__label emotion-20"
+                                                data-part="label"
+                                                data-scope="field"
+                                                htmlFor=":r8a:"
+                                                id="field:::r8a:::label"
+                                              >
+                                                title
+                                              </label>
+                                              <input
+                                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                                autoFocus={false}
+                                                className="chakra-input emotion-21"
+                                                data-part="input"
+                                                data-scope="field"
+                                                disabled={false}
+                                                id="root_tasks_0_title"
+                                                name="root[tasks][0][title]"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 1"
+                                              />
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-boolean"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::r8b:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::r8c:"
+                                              role="group"
+                                            >
+                                              <label
+                                                aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                                className="chakra-checkbox__root emotion-25"
+                                                data-part="root"
+                                                data-scope="checkbox"
+                                                data-state="unchecked"
+                                                dir="ltr"
+                                                htmlFor=":r8c:"
+                                                id="checkbox:root_tasks_0_done"
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onPointerLeave={[Function]}
+                                                onPointerMove={[Function]}
+                                              >
+                                                <input
+                                                  aria-invalid={false}
+                                                  aria-labelledby="field:::r8c:::label"
+                                                  defaultChecked={false}
+                                                  disabled={false}
+                                                  id=":r8c:"
+                                                  name="root[tasks][0][done]"
+                                                  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",
+                                                    }
+                                                  }
+                                                  type="checkbox"
+                                                  value="on"
+                                                />
+                                                <div
+                                                  aria-hidden={true}
+                                                  className="chakra-checkbox__control emotion-26"
+                                                  data-part="control"
+                                                  data-scope="checkbox"
+                                                  data-state="unchecked"
+                                                  dir="ltr"
+                                                  id="checkbox:root_tasks_0_done:control"
+                                                >
+                                                  <svg
+                                                    className="emotion-27"
+                                                    data-state="unchecked"
+                                                    viewBox="0 0 24 24"
+                                                  />
+                                                </div>
+                                                <span
+                                                  className="chakra-checkbox__label emotion-28"
+                                                  data-part="label"
+                                                  data-scope="checkbox"
+                                                  data-state="unchecked"
+                                                  dir="ltr"
+                                                  id="field:::r8c:::label"
+                                                >
+                                                  <p>
+                                                    done
+                                                  </p>
+                                                </span>
+                                              </label>
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-29"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-30"
+                                disabled={true}
+                                id="root_tasks_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-30"
+                                disabled={false}
+                                id="root_tasks_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-30"
+                                disabled={false}
+                                id="root_tasks_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r8e:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="emotion-5"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5
+                                      className="chakra-heading emotion-6"
+                                    >
+                                      tasks-2
+                                    </h5>
+                                    <span
+                                      aria-orientation="horizontal"
+                                      className="chakra-separator emotion-7"
+                                      role="separator"
+                                    />
+                                  </div>
+                                  <div
+                                    className="emotion-2"
+                                  >
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::r8f:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::r8g:"
+                                              role="group"
+                                            >
+                                              <label
+                                                className="chakra-field__label emotion-20"
+                                                data-part="label"
+                                                data-scope="field"
+                                                htmlFor=":r8g:"
+                                                id="field:::r8g:::label"
+                                              >
+                                                title
+                                              </label>
+                                              <input
+                                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                                autoFocus={false}
+                                                className="chakra-input emotion-21"
+                                                data-part="input"
+                                                data-scope="field"
+                                                disabled={false}
+                                                id="root_tasks_1_title"
+                                                name="root[tasks][1][title]"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 2"
+                                              />
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-boolean"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::r8h:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::r8i:"
+                                              role="group"
+                                            >
+                                              <label
+                                                aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                                className="chakra-checkbox__root emotion-25"
+                                                data-part="root"
+                                                data-scope="checkbox"
+                                                data-state="checked"
+                                                dir="ltr"
+                                                htmlFor=":r8i:"
+                                                id="checkbox:root_tasks_1_done"
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onPointerLeave={[Function]}
+                                                onPointerMove={[Function]}
+                                              >
+                                                <input
+                                                  aria-invalid={false}
+                                                  aria-labelledby="field:::r8i:::label"
+                                                  defaultChecked={true}
+                                                  disabled={false}
+                                                  id=":r8i:"
+                                                  name="root[tasks][1][done]"
+                                                  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",
+                                                    }
+                                                  }
+                                                  type="checkbox"
+                                                  value="on"
+                                                />
+                                                <div
+                                                  aria-hidden={true}
+                                                  className="chakra-checkbox__control emotion-26"
+                                                  data-part="control"
+                                                  data-scope="checkbox"
+                                                  data-state="checked"
+                                                  dir="ltr"
+                                                  id="checkbox:root_tasks_1_done:control"
+                                                >
+                                                  <svg
+                                                    className="emotion-27"
+                                                    data-state="checked"
+                                                    viewBox="0 0 24 24"
+                                                  >
+                                                    <polyline
+                                                      points="20 6 9 17 4 12"
+                                                    />
+                                                  </svg>
+                                                </div>
+                                                <span
+                                                  className="chakra-checkbox__label emotion-28"
+                                                  data-part="label"
+                                                  data-scope="checkbox"
+                                                  data-state="checked"
+                                                  dir="ltr"
+                                                  id="field:::r8i:::label"
+                                                >
+                                                  <p>
+                                                    done
+                                                  </p>
+                                                </span>
+                                              </label>
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-29"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-30"
+                                disabled={false}
+                                id="root_tasks_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-30"
+                                disabled={true}
+                                id="root_tasks_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-30"
+                                disabled={false}
+                                id="root_tasks_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-57"
+                      >
+                        <div
+                          className="emotion-58"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-59"
+                            disabled={false}
+                            id="root_tasks__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-60"
+  >
+    <button
+      className="chakra-button emotion-59"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-8 {
+  display: grid;
+}
+
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-10 {
+  width: 100%;
+}
+
+.emotion-13 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-13 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-14 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-14:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-15 {
+    color: var(--chakra-colors-fg-error);
+    line-height: 1;
+  }
+}
+
+@layer recipes {
+  .emotion-16 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-16:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-16:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-16:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-17 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-17 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-17>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-17>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-17>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-18 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-18:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-18:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-18 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-18:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-18:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-18 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-33 {
+  justify-self: flex-end;
+}
+
+.emotion-34 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-35 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-35:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-35:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-35 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-35:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-35:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-36 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r80:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r81:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-5"
+                      id="root_tags__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-6"
+                      >
+                        tags
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-7"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-8"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r82:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-13"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r83:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-14"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r83:"
+                                      id="field:::r83:::label"
+                                    >
+                                      tags-0
+                                      <span
+                                        aria-hidden="true"
+                                        className="chakra-field__requiredIndicator emotion-15"
+                                      >
+                                        *
+                                      </span>
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-16"
+                                      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}
+                                      type="text"
+                                      value="foo"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-17"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-18"
+                                disabled={true}
+                                id="root_tags_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-18"
+                                disabled={false}
+                                id="root_tags_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-18"
+                                disabled={false}
+                                id="root_tags_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r84:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-13"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r85:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-14"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r85:"
+                                      id="field:::r85:::label"
+                                    >
+                                      tags-1
+                                      <span
+                                        aria-hidden="true"
+                                        className="chakra-field__requiredIndicator emotion-15"
+                                      >
+                                        *
+                                      </span>
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-16"
+                                      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}
+                                      type="text"
+                                      value="bar"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-17"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-18"
+                                disabled={false}
+                                id="root_tags_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-18"
+                                disabled={true}
+                                id="root_tags_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-18"
+                                disabled={false}
+                                id="root_tags_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-33"
+                      >
+                        <div
+                          className="emotion-34"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-35"
+                            disabled={false}
+                            id="root_tags__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-36"
+  >
+    <button
+      className="chakra-button emotion-35"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-5>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    gap: var(--chakra-spacing-1\\.5);
+  }
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+@layer recipes {
+  .emotion-8 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-9:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-9 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-9:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-9:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-9:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-10 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-11 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-11:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-20 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-21 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-21 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-21:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-21:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r8s:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r8t:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <fieldset
+                    aria-labelledby="fieldset:::r8u:::legend"
+                    className="fieldset__root emotion-5"
+                    data-part="root"
+                    data-scope="fieldset"
+                    disabled={false}
+                  >
+                    <div
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      className="emotion-6"
+                      data-part="group"
+                      data-scope="checkbox"
+                      label="choices"
+                      required={false}
+                      role="group"
+                    >
+                      <div
+                        className="chakra-stack emotion-7"
+                      >
+                        <label
+                          className="chakra-checkbox__root emotion-8"
+                          data-part="root"
+                          data-scope="checkbox"
+                          data-state="unchecked"
+                          dir="ltr"
+                          htmlFor="checkbox:root_choices-0:input"
+                          id="checkbox:root_choices-0"
+                          onBlur={[Function]}
+                          onClick={[Function]}
+                          onFocus={[Function]}
+                          onPointerLeave={[Function]}
+                          onPointerMove={[Function]}
+                        >
+                          <input
+                            aria-labelledby="checkbox:root_choices-0:label"
+                            defaultChecked={false}
+                            disabled={false}
+                            id="checkbox:root_choices-0:input"
+                            name="root[choices][]"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            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",
+                              }
+                            }
+                            type="checkbox"
+                            value="0"
+                          />
+                          <div
+                            aria-hidden={true}
+                            className="chakra-checkbox__control emotion-9"
+                            data-part="control"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-0:control"
+                          >
+                            <svg
+                              className="emotion-10"
+                              data-state="unchecked"
+                              viewBox="0 0 24 24"
+                            />
+                          </div>
+                          <span
+                            className="chakra-checkbox__label emotion-11"
+                            data-part="label"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-0:label"
+                          >
+                            <p>
+                              foo
+                            </p>
+                          </span>
+                        </label>
+                        <label
+                          className="chakra-checkbox__root emotion-8"
+                          data-part="root"
+                          data-scope="checkbox"
+                          data-state="unchecked"
+                          dir="ltr"
+                          htmlFor="checkbox:root_choices-1:input"
+                          id="checkbox:root_choices-1"
+                          onBlur={[Function]}
+                          onClick={[Function]}
+                          onFocus={[Function]}
+                          onPointerLeave={[Function]}
+                          onPointerMove={[Function]}
+                        >
+                          <input
+                            aria-labelledby="checkbox:root_choices-1:label"
+                            defaultChecked={false}
+                            disabled={false}
+                            id="checkbox:root_choices-1:input"
+                            name="root[choices][]"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            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",
+                              }
+                            }
+                            type="checkbox"
+                            value="1"
+                          />
+                          <div
+                            aria-hidden={true}
+                            className="chakra-checkbox__control emotion-9"
+                            data-part="control"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-1:control"
+                          >
+                            <svg
+                              className="emotion-10"
+                              data-state="unchecked"
+                              viewBox="0 0 24 24"
+                            />
+                          </div>
+                          <span
+                            className="chakra-checkbox__label emotion-11"
+                            data-part="label"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-1:label"
+                          >
+                            <p>
+                              bar
+                            </p>
+                          </span>
+                        </label>
+                        <label
+                          className="chakra-checkbox__root emotion-8"
+                          data-part="root"
+                          data-scope="checkbox"
+                          data-state="unchecked"
+                          dir="ltr"
+                          htmlFor="checkbox:root_choices-2:input"
+                          id="checkbox:root_choices-2"
+                          onBlur={[Function]}
+                          onClick={[Function]}
+                          onFocus={[Function]}
+                          onPointerLeave={[Function]}
+                          onPointerMove={[Function]}
+                        >
+                          <input
+                            aria-labelledby="checkbox:root_choices-2:label"
+                            defaultChecked={false}
+                            disabled={false}
+                            id="checkbox:root_choices-2:input"
+                            name="root[choices][]"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            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",
+                              }
+                            }
+                            type="checkbox"
+                            value="2"
+                          />
+                          <div
+                            aria-hidden={true}
+                            className="chakra-checkbox__control emotion-9"
+                            data-part="control"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-2:control"
+                          >
+                            <svg
+                              className="emotion-10"
+                              data-state="unchecked"
+                              viewBox="0 0 24 24"
+                            />
+                          </div>
+                          <span
+                            className="chakra-checkbox__label emotion-11"
+                            data-part="label"
+                            data-scope="checkbox"
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="checkbox:root_choices-2:label"
+                          >
+                            <p>
+                              baz
+                            </p>
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-20"
+  >
+    <button
+      className="chakra-button emotion-21"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-11 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-35 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-36 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-36:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-36:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-36 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-36:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-36:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r7l:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r7m:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="emotion-5"
+                    id="root_person__title"
+                  >
+                    <h5
+                      className="chakra-heading emotion-6"
+                    >
+                      person
+                    </h5>
+                    <span
+                      aria-orientation="horizontal"
+                      className="chakra-separator emotion-7"
+                      role="separator"
+                    />
+                  </div>
+                  <div
+                    className="emotion-2"
+                  >
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r7n:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r7o:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":r7o:"
+                                id="field:::r7o:::label"
+                              >
+                                firstName
+                              </label>
+                              <input
+                                aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                                autoFocus={false}
+                                className="chakra-input emotion-13"
+                                data-part="input"
+                                data-scope="field"
+                                disabled={false}
+                                id="root_person_firstName"
+                                name="root[person][firstName]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                readOnly={false}
+                                required={false}
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r7p:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r7q:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":r7q:"
+                                id="field:::r7q:::label"
+                              >
+                                lastName
+                              </label>
+                              <input
+                                aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                                autoFocus={false}
+                                className="chakra-input emotion-13"
+                                data-part="input"
+                                data-scope="field"
+                                disabled={false}
+                                id="root_person_lastName"
+                                name="root[person][lastName]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                readOnly={false}
+                                required={false}
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r7r:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="emotion-5"
+                              id="root_person_address__title"
+                            >
+                              <h5
+                                className="chakra-heading emotion-6"
+                              >
+                                address
+                              </h5>
+                              <span
+                                aria-orientation="horizontal"
+                                className="chakra-separator emotion-7"
+                                role="separator"
+                              />
+                            </div>
+                            <div
+                              className="emotion-2"
+                            >
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r7s:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r7t:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":r7t:"
+                                          id="field:::r7t:::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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r7u:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r7v:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":r7v:"
+                                          id="field:::r7v:::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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-35"
+  >
+    <button
+      className="chakra-button emotion-36"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-7 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  gap: 0.5rem;
+}
+
+@layer recipes {
+  .emotion-8 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    position: relative;
+    font-weight: var(--chakra-font-weights-medium);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    gap: var(--chakra-spacing-2\\.5);
+  }
+
+  .emotion-8:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    cursor: var(--chakra-cursor-disabled);
+  }
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    vertical-align: top;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-full);
+    cursor: var(--chakra-cursor-radio);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-9:is(:focus-visible, [data-focus-visible]) {
+    outline: 2px solid;
+    outline-color: var(--chakra-colors-color-palette-focus-ring);
+    outline-offset: 2px;
+  }
+
+  .emotion-9:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-red-500);
+  }
+
+  .emotion-9:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-9 .dot {
+    height: 100%;
+    width: 100%;
+    border-radius: var(--chakra-radii-full);
+    background: currentColor;
+    --bg-currentcolor: currentColor;
+    scale: 0.4;
+  }
+
+  .emotion-9:is(:checked, [data-checked], [aria-checked=true], [data-state=checked]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-12 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-13 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-13:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-13:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r8o:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r8p:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r8q:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r8q:"
+                      id="field:::r8q:::label"
+                    >
+                      option
+                    </label>
+                    <div
+                      aria-describedby="root_option__error root_option__description root_option__help"
+                      aria-labelledby="radio-group::r8r::label"
+                      aria-orientation="vertical"
+                      className="chakra-radio-group__root"
+                      data-orientation="vertical"
+                      data-part="root"
+                      data-scope="radio-group"
+                      dir="ltr"
+                      id="radio-group::r8r:"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      role="radiogroup"
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        className="chakra-stack emotion-7"
+                      >
+                        <label
+                          className="chakra-radio-group__item emotion-8"
+                          data-orientation="vertical"
+                          data-part="item"
+                          data-scope="radio-group"
+                          data-ssr=""
+                          data-state="unchecked"
+                          dir="ltr"
+                          htmlFor="radio-group::r8r::radio:input:0"
+                          id="root_option-0"
+                          onClick={[Function]}
+                          onPointerDown={[Function]}
+                          onPointerLeave={[Function]}
+                          onPointerMove={[Function]}
+                          onPointerUp={[Function]}
+                        >
+                          <input
+                            data-ownedby="radio-group::r8r:"
+                            defaultChecked={false}
+                            disabled={false}
+                            id="radio-group::r8r::radio:input:0"
+                            name="root[option]"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            onKeyDown={[Function]}
+                            onKeyUp={[Function]}
+                            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",
+                              }
+                            }
+                            type="radio"
+                            value="0"
+                          />
+                          <span
+                            aria-hidden={true}
+                            className="emotion-9"
+                            data-orientation="vertical"
+                            data-part="item-control"
+                            data-scope="radio-group"
+                            data-ssr=""
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="radio-group::r8r::radio:control:0"
+                          />
+                          <span
+                            className="chakra-radio-group__itemText"
+                            data-orientation="vertical"
+                            data-part="item-text"
+                            data-scope="radio-group"
+                            data-ssr=""
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="radio-group::r8r::radio:label:0"
+                          >
+                            foo
+                          </span>
+                        </label>
+                        <label
+                          className="chakra-radio-group__item emotion-8"
+                          data-orientation="vertical"
+                          data-part="item"
+                          data-scope="radio-group"
+                          data-ssr=""
+                          data-state="unchecked"
+                          dir="ltr"
+                          htmlFor="radio-group::r8r::radio:input:1"
+                          id="root_option-1"
+                          onClick={[Function]}
+                          onPointerDown={[Function]}
+                          onPointerLeave={[Function]}
+                          onPointerMove={[Function]}
+                          onPointerUp={[Function]}
+                        >
+                          <input
+                            data-ownedby="radio-group::r8r:"
+                            defaultChecked={false}
+                            disabled={false}
+                            id="radio-group::r8r::radio:input:1"
+                            name="root[option]"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            onKeyDown={[Function]}
+                            onKeyUp={[Function]}
+                            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",
+                              }
+                            }
+                            type="radio"
+                            value="1"
+                          />
+                          <span
+                            aria-hidden={true}
+                            className="emotion-9"
+                            data-orientation="vertical"
+                            data-part="item-control"
+                            data-scope="radio-group"
+                            data-ssr=""
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="radio-group::r8r::radio:control:1"
+                          />
+                          <span
+                            className="chakra-radio-group__itemText"
+                            data-orientation="vertical"
+                            data-part="item-text"
+                            data-scope="radio-group"
+                            data-ssr=""
+                            data-state="unchecked"
+                            dir="ltr"
+                            id="radio-group::r8r::radio:label:1"
+                          >
+                            bar
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-12"
+  >
+    <button
+      className="chakra-button emotion-13"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+  position: relative;
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    gap: var(--chakra-spacing-1\\.5);
+    width: var(--chakra-sizes-full);
+    --select-trigger-height: var(--chakra-sizes-10);
+    --select-trigger-padding-x: var(--chakra-spacing-3);
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    width: var(--chakra-sizes-full);
+    min-height: var(--select-trigger-height);
+    --input-height: var(--select-trigger-height);
+    padding-inline: var(--select-trigger-padding-x);
+    border-radius: var(--chakra-radii-l2);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    text-align: start;
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+  }
+
+  .emotion-10:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+
+  .emotion-10:is(:placeholder-shown, [data-placeholder-shown]) {
+    --mix-color: color-mix(in srgb, var(--chakra-colors-fg-muted) 80%, transparent);
+    color: var(--mix-color, var(--chakra-colors-fg-muted));
+  }
+
+  .emotion-10:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-10:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-10:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    border-color: var(--chakra-colors-border-emphasized);
+  }
+}
+
+@layer recipes {
+  .emotion-11 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    text-wrap: wrap;
+    max-width: 80%;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-1);
+    position: absolute;
+    inset-inline-end: 0;
+    top: 0;
+    bottom: 0;
+    padding-inline: var(--select-trigger-padding-x);
+    pointer-events: none;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    color: var(--chakra-colors-fg-muted);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    color: var(--chakra-colors-fg-subtle);
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    color: var(--chakra-colors-fg-error);
+  }
+
+  .emotion-13 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+.emotion-14 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 2;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.emotion-15 {
+  min-width: 100%!important;
+  z-index: 2!important;
+  top: calc(100% + 5px)!important;
+}
+
+@layer recipes {
+  .emotion-16 {
+    background: var(--chakra-colors-bg-panel);
+    --bg-currentcolor: var(--chakra-colors-bg-panel);
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    z-index: var(--chakra-z-index-dropdown);
+    border-radius: var(--chakra-radii-l2);
+    outline: 0;
+    max-height: var(--chakra-sizes-96);
+    overflow-y: auto;
+    box-shadow: var(--chakra-shadows-md);
+    padding: var(--chakra-spacing-1);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fast);
+    animation-duration: var(--chakra-durations-fast);
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=top] {
+    -webkit-animation-name: slide-from-bottom,fade-in;
+    animation-name: slide-from-bottom,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=bottom] {
+    -webkit-animation-name: slide-from-top,fade-in;
+    animation-name: slide-from-top,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=left] {
+    -webkit-animation-name: slide-from-right,fade-in;
+    animation-name: slide-from-right,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=right] {
+    -webkit-animation-name: slide-from-left,fade-in;
+    animation-name: slide-from-left,fade-in;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fastest);
+    animation-duration: var(--chakra-durations-fastest);
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=top] {
+    -webkit-animation-name: slide-to-bottom,fade-out;
+    animation-name: slide-to-bottom,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=bottom] {
+    -webkit-animation-name: slide-to-top,fade-out;
+    animation-name: slide-to-top,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=left] {
+    -webkit-animation-name: slide-to-right,fade-out;
+    animation-name: slide-to-right,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=right] {
+    -webkit-animation-name: slide-to-left,fade-out;
+    animation-name: slide-to-left,fade-out;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    position: relative;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-2);
+    cursor: var(--chakra-cursor-option);
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    text-align: start;
+    border-radius: var(--chakra-radii-l1);
+    padding-block: var(--chakra-spacing-1\\.5);
+    padding-inline: var(--chakra-spacing-2);
+  }
+
+  .emotion-17[data-highlighted] {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-bg-emphasized) 60%, transparent);
+    background: var(--mix-background, var(--chakra-colors-bg-emphasized));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-bg-emphasized));
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  .emotion-17 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+  }
+}
+
+.emotion-26 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-27 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-27:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-27:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-27 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-27:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-27:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r8k:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r8l:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r8m:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r8m:"
+                      id="field:::r8m:::label"
+                    >
+                      color
+                    </label>
+                    <div
+                      aria-describedby="root_color__error root_color__description root_color__help"
+                      autoFocus={false}
+                      className="chakra-select__root emotion-7"
+                      data-part="root"
+                      data-scope="select"
+                      dir="ltr"
+                      id="select:root_color"
+                      onBlur={[Function]}
+                      onFocus={[Function]}
+                    >
+                      <select
+                        aria-hidden={true}
+                        aria-labelledby="field:::r8m:::label"
+                        disabled={false}
+                        id=":r8m:"
+                        multiple={false}
+                        name="root[color]"
+                        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",
+                          }
+                        }
+                        tabIndex={-1}
+                      >
+                        <option
+                          value=""
+                        />
+                        <option
+                          disabled={false}
+                          value="0"
+                        >
+                          red
+                        </option>
+                        <option
+                          disabled={false}
+                          value="1"
+                        >
+                          green
+                        </option>
+                        <option
+                          disabled={false}
+                          value="2"
+                        >
+                          blue
+                        </option>
+                      </select>
+                      <div
+                        className="chakra-select__control emotion-8"
+                        data-part="control"
+                        data-scope="select"
+                        data-state="closed"
+                        dir="ltr"
+                        id="select:root_color:control"
+                      >
+                        <div
+                          className="chakra-select__control emotion-8"
+                          data-part="control"
+                          data-scope="select"
+                          data-state="closed"
+                          dir="ltr"
+                          id="select:root_color:control"
+                        >
+                          <button
+                            aria-controls="select:root_color:content"
+                            aria-expanded={false}
+                            aria-haspopup="listbox"
+                            aria-invalid={false}
+                            aria-labelledby="field:::r8m:::label"
+                            className="chakra-select__trigger emotion-10"
+                            data-part="trigger"
+                            data-placeholder-shown=""
+                            data-scope="select"
+                            data-state="closed"
+                            dir="ltr"
+                            disabled={false}
+                            id="select:root_color:trigger"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            onKeyDown={[Function]}
+                            role="combobox"
+                            type="button"
+                          >
+                            <span
+                              className="chakra-select__valueText emotion-11"
+                              data-part="value-text"
+                              data-scope="select"
+                              dir="ltr"
+                            />
+                          </button>
+                          <div
+                            className="chakra-select__indicatorGroup emotion-12"
+                          >
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__indicator emotion-13"
+                              data-part="indicator"
+                              data-scope="select"
+                              data-state="closed"
+                              dir="ltr"
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="m6 9 6 6 6-6"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="chakra-select__positioner emotion-15"
+                        data-part="positioner"
+                        data-scope="select"
+                        dir="ltr"
+                        id="select:root_color:positioner"
+                        style={
+                          {
+                            "isolation": "isolate",
+                            "left": "0px",
+                            "maxHeight": undefined,
+                            "maxWidth": undefined,
+                            "minWidth": undefined,
+                            "pointerEvents": "none",
+                            "position": "absolute",
+                            "top": "0px",
+                            "transform": "translate3d(0, -100vh, 0)",
+                            "width": "var(--reference-width)",
+                            "zIndex": "var(--z-index)",
+                          }
+                        }
+                      >
+                        <div
+                          aria-labelledby="field:::r8m:::label"
+                          className="chakra-select__content emotion-16"
+                          data-part="content"
+                          data-scope="select"
+                          data-state="closed"
+                          dir="ltr"
+                          hidden={true}
+                          id="select:root_color:content"
+                          onKeyDown={[Function]}
+                          role="listbox"
+                          tabIndex={0}
+                        >
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="0"
+                            dir="ltr"
+                            id="select:root_color:option:0"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            red
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="1"
+                            dir="ltr"
+                            id="select:root_color:option:1"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            green
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="2"
+                            dir="ltr"
+                            id="select:root_color:option:2"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            blue
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-26"
+  >
+    <button
+      className="chakra-button emotion-27"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-16 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-17:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-17 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-17:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-17:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-18 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-19 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-20 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-21 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-21 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-21:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-21:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r7d:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r7e:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r7f:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r7f:"
+                      id="field:::r7f:::label"
+                    >
+                      firstName
+                    </label>
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      autoFocus={false}
+                      className="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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r7g:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r7h:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r7h:"
+                      id="field:::r7h:::label"
+                    >
+                      age
+                    </label>
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      autoFocus={false}
+                      className="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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r7i:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r7j:"
+                    role="group"
+                  >
+                    <label
+                      aria-describedby="root_active__error root_active__description root_active__help"
+                      className="chakra-checkbox__root emotion-16"
+                      data-part="root"
+                      data-scope="checkbox"
+                      data-state="unchecked"
+                      dir="ltr"
+                      htmlFor=":r7j:"
+                      id="checkbox:root_active"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onPointerLeave={[Function]}
+                      onPointerMove={[Function]}
+                    >
+                      <input
+                        aria-invalid={false}
+                        aria-labelledby="field:::r7j:::label"
+                        defaultChecked={false}
+                        disabled={false}
+                        id=":r7j:"
+                        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",
+                          }
+                        }
+                        type="checkbox"
+                        value="on"
+                      />
+                      <div
+                        aria-hidden={true}
+                        className="chakra-checkbox__control emotion-17"
+                        data-part="control"
+                        data-scope="checkbox"
+                        data-state="unchecked"
+                        dir="ltr"
+                        id="checkbox:root_active:control"
+                      >
+                        <svg
+                          className="emotion-18"
+                          data-state="unchecked"
+                          viewBox="0 0 24 24"
+                        />
+                      </div>
+                      <span
+                        className="chakra-checkbox__label emotion-19"
+                        data-part="label"
+                        data-scope="checkbox"
+                        data-state="unchecked"
+                        dir="ltr"
+                        id="field:::r7j:::label"
+                      >
+                        <p>
+                          active
+                        </p>
+                      </span>
+                    </label>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-20"
+  >
+    <button
+      className="chakra-button emotion-21"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: 0;
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    padding-block: var(--chakra-spacing-2);
+    scroll-padding-bottom: var(--chakra-spacing-2);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-8 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-9:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-9:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-9 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-9:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-9:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r92:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r93:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r94:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r94:"
+                      id="field:::r94:::label"
+                    >
+                      description
+                    </label>
+                    <textarea
+                      aria-describedby="root_description__error root_description__description root_description__help"
+                      autoFocus={false}
+                      className="chakra-textarea emotion-7"
+                      data-part="textarea"
+                      data-scope="field"
+                      disabled={false}
+                      id="root_description"
+                      name="root[description]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      readOnly={false}
+                      required={false}
+                      style={
+                        {
+                          "resize": undefined,
+                        }
+                      }
+                      value=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-8"
+  >
+    <button
+      className="chakra-button emotion-9"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-8 {
+  display: grid;
+}
+
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-10 {
+  width: 100%;
+}
+
+.emotion-19 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-20 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-20:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-21 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-21:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-25 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-26 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-26:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-26 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-26:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-26:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-26:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-27 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-28 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-28:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-29 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-29 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-29 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-29>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-29>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-29>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-30 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-30 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-30:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-30:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-30 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-30:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-30:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-30 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-57 {
+  justify-self: flex-end;
+}
+
+.emotion-58 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-59 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-59:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-59:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-59 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-59:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-59:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-60 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r9u:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r9v:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-5"
+                      id="root_tasks__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-6"
+                      >
+                        tasks
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-7"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-8"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::ra0:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="emotion-5"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5
+                                      className="chakra-heading emotion-6"
+                                    >
+                                      tasks-1
+                                    </h5>
+                                    <span
+                                      aria-orientation="horizontal"
+                                      className="chakra-separator emotion-7"
+                                      role="separator"
+                                    />
+                                  </div>
+                                  <div
+                                    className="emotion-2"
+                                  >
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::ra1:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::ra2:"
+                                              role="group"
+                                            >
+                                              <label
+                                                className="chakra-field__label emotion-20"
+                                                data-part="label"
+                                                data-scope="field"
+                                                htmlFor=":ra2:"
+                                                id="field:::ra2:::label"
+                                              >
+                                                title
+                                              </label>
+                                              <input
+                                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                                autoFocus={false}
+                                                className="chakra-input emotion-21"
+                                                data-part="input"
+                                                data-scope="field"
+                                                disabled={false}
+                                                id="root_tasks_0_title"
+                                                name="root.tasks.0.title"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 1"
+                                              />
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-boolean"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::ra3:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::ra4:"
+                                              role="group"
+                                            >
+                                              <label
+                                                aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                                className="chakra-checkbox__root emotion-25"
+                                                data-part="root"
+                                                data-scope="checkbox"
+                                                data-state="unchecked"
+                                                dir="ltr"
+                                                htmlFor=":ra4:"
+                                                id="checkbox:root_tasks_0_done"
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onPointerLeave={[Function]}
+                                                onPointerMove={[Function]}
+                                              >
+                                                <input
+                                                  aria-invalid={false}
+                                                  aria-labelledby="field:::ra4:::label"
+                                                  defaultChecked={false}
+                                                  disabled={false}
+                                                  id=":ra4:"
+                                                  name="root.tasks.0.done"
+                                                  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",
+                                                    }
+                                                  }
+                                                  type="checkbox"
+                                                  value="on"
+                                                />
+                                                <div
+                                                  aria-hidden={true}
+                                                  className="chakra-checkbox__control emotion-26"
+                                                  data-part="control"
+                                                  data-scope="checkbox"
+                                                  data-state="unchecked"
+                                                  dir="ltr"
+                                                  id="checkbox:root_tasks_0_done:control"
+                                                >
+                                                  <svg
+                                                    className="emotion-27"
+                                                    data-state="unchecked"
+                                                    viewBox="0 0 24 24"
+                                                  />
+                                                </div>
+                                                <span
+                                                  className="chakra-checkbox__label emotion-28"
+                                                  data-part="label"
+                                                  data-scope="checkbox"
+                                                  data-state="unchecked"
+                                                  dir="ltr"
+                                                  id="field:::ra4:::label"
+                                                >
+                                                  <p>
+                                                    done
+                                                  </p>
+                                                </span>
+                                              </label>
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-29"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-30"
+                                disabled={true}
+                                id="root_tasks_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-30"
+                                disabled={false}
+                                id="root_tasks_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-30"
+                                disabled={false}
+                                id="root_tasks_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::ra6:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="emotion-5"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5
+                                      className="chakra-heading emotion-6"
+                                    >
+                                      tasks-2
+                                    </h5>
+                                    <span
+                                      aria-orientation="horizontal"
+                                      className="chakra-separator emotion-7"
+                                      role="separator"
+                                    />
+                                  </div>
+                                  <div
+                                    className="emotion-2"
+                                  >
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::ra7:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::ra8:"
+                                              role="group"
+                                            >
+                                              <label
+                                                className="chakra-field__label emotion-20"
+                                                data-part="label"
+                                                data-scope="field"
+                                                htmlFor=":ra8:"
+                                                id="field:::ra8:::label"
+                                              >
+                                                title
+                                              </label>
+                                              <input
+                                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                                autoFocus={false}
+                                                className="chakra-input emotion-21"
+                                                data-part="input"
+                                                data-scope="field"
+                                                disabled={false}
+                                                id="root_tasks_1_title"
+                                                name="root.tasks.1.title"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 2"
+                                              />
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                    <div>
+                                      <div
+                                        className="rjsf-field rjsf-field-boolean"
+                                      >
+                                        <fieldset
+                                          aria-labelledby="fieldset:::ra9:::legend"
+                                          className="fieldset__root emotion-0"
+                                          data-part="root"
+                                          data-scope="fieldset"
+                                          disabled={false}
+                                        >
+                                          <div
+                                            className="fieldset__content emotion-1"
+                                          >
+                                            <div
+                                              className="chakra-field__root emotion-19"
+                                              data-part="root"
+                                              data-scope="field"
+                                              id="field:::raa:"
+                                              role="group"
+                                            >
+                                              <label
+                                                aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                                className="chakra-checkbox__root emotion-25"
+                                                data-part="root"
+                                                data-scope="checkbox"
+                                                data-state="checked"
+                                                dir="ltr"
+                                                htmlFor=":raa:"
+                                                id="checkbox:root_tasks_1_done"
+                                                onBlur={[Function]}
+                                                onClick={[Function]}
+                                                onFocus={[Function]}
+                                                onPointerLeave={[Function]}
+                                                onPointerMove={[Function]}
+                                              >
+                                                <input
+                                                  aria-invalid={false}
+                                                  aria-labelledby="field:::raa:::label"
+                                                  defaultChecked={true}
+                                                  disabled={false}
+                                                  id=":raa:"
+                                                  name="root.tasks.1.done"
+                                                  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",
+                                                    }
+                                                  }
+                                                  type="checkbox"
+                                                  value="on"
+                                                />
+                                                <div
+                                                  aria-hidden={true}
+                                                  className="chakra-checkbox__control emotion-26"
+                                                  data-part="control"
+                                                  data-scope="checkbox"
+                                                  data-state="checked"
+                                                  dir="ltr"
+                                                  id="checkbox:root_tasks_1_done:control"
+                                                >
+                                                  <svg
+                                                    className="emotion-27"
+                                                    data-state="checked"
+                                                    viewBox="0 0 24 24"
+                                                  >
+                                                    <polyline
+                                                      points="20 6 9 17 4 12"
+                                                    />
+                                                  </svg>
+                                                </div>
+                                                <span
+                                                  className="chakra-checkbox__label emotion-28"
+                                                  data-part="label"
+                                                  data-scope="checkbox"
+                                                  data-state="checked"
+                                                  dir="ltr"
+                                                  id="field:::raa:::label"
+                                                >
+                                                  <p>
+                                                    done
+                                                  </p>
+                                                </span>
+                                              </label>
+                                            </div>
+                                          </div>
+                                        </fieldset>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-29"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-30"
+                                disabled={false}
+                                id="root_tasks_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-30"
+                                disabled={true}
+                                id="root_tasks_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-30"
+                                disabled={false}
+                                id="root_tasks_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-57"
+                      >
+                        <div
+                          className="emotion-58"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-59"
+                            disabled={false}
+                            id="root_tasks__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-60"
+  >
+    <button
+      className="chakra-button emotion-59"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-8 {
+  display: grid;
+}
+
+.emotion-9 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-10 {
+  width: 100%;
+}
+
+.emotion-13 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-13 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-14 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-14:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-15 {
+    color: var(--chakra-colors-fg-error);
+    line-height: 1;
+  }
+}
+
+@layer recipes {
+  .emotion-16 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-16:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-16:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-16:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-17 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-17 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-17>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-17>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-17>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-18 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-18:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-18:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-18 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-18:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-18:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-18 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-33 {
+  justify-self: flex-end;
+}
+
+.emotion-34 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-35 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-35:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-35:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-35 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-35:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-35:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-36 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r9o:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r9p:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-5"
+                      id="root_tags__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-6"
+                      >
+                        tags
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-7"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-8"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r9q:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-13"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r9r:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-14"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r9r:"
+                                      id="field:::r9r:::label"
+                                    >
+                                      tags-0
+                                      <span
+                                        aria-hidden="true"
+                                        className="chakra-field__requiredIndicator emotion-15"
+                                      >
+                                        *
+                                      </span>
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-16"
+                                      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}
+                                      type="text"
+                                      value="foo"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-17"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-18"
+                                disabled={true}
+                                id="root_tags_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-18"
+                                disabled={false}
+                                id="root_tags_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-18"
+                                disabled={false}
+                                id="root_tags_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-9"
+                        >
+                          <div
+                            className="emotion-10"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r9s:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-13"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r9t:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-14"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r9t:"
+                                      id="field:::r9t:::label"
+                                    >
+                                      tags-1
+                                      <span
+                                        aria-hidden="true"
+                                        className="chakra-field__requiredIndicator emotion-15"
+                                      >
+                                        *
+                                      </span>
+                                    </label>
+                                    <input
+                                      aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                      autoFocus={false}
+                                      className="chakra-input emotion-16"
+                                      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}
+                                      type="text"
+                                      value="bar"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-17"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-18"
+                                disabled={false}
+                                id="root_tags_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-18"
+                                disabled={true}
+                                id="root_tags_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-18"
+                                disabled={false}
+                                id="root_tags_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-33"
+                      >
+                        <div
+                          className="emotion-34"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-35"
+                            disabled={false}
+                            id="root_tags__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-36"
+  >
+    <button
+      className="chakra-button emotion-35"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-11 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-35 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-36 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-36:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-36:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-36 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-36:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-36:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r9d:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r9e:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="emotion-5"
+                    id="root_person__title"
+                  >
+                    <h5
+                      className="chakra-heading emotion-6"
+                    >
+                      person
+                    </h5>
+                    <span
+                      aria-orientation="horizontal"
+                      className="chakra-separator emotion-7"
+                      role="separator"
+                    />
+                  </div>
+                  <div
+                    className="emotion-2"
+                  >
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r9f:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r9g:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":r9g:"
+                                id="field:::r9g:::label"
+                              >
+                                firstName
+                              </label>
+                              <input
+                                aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                                autoFocus={false}
+                                className="chakra-input emotion-13"
+                                data-part="input"
+                                data-scope="field"
+                                disabled={false}
+                                id="root_person_firstName"
+                                name="root.person.firstName"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                readOnly={false}
+                                required={false}
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r9h:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r9i:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":r9i:"
+                                id="field:::r9i:::label"
+                              >
+                                lastName
+                              </label>
+                              <input
+                                aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                                autoFocus={false}
+                                className="chakra-input emotion-13"
+                                data-part="input"
+                                data-scope="field"
+                                disabled={false}
+                                id="root_person_lastName"
+                                name="root.person.lastName"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                readOnly={false}
+                                required={false}
+                                type="text"
+                                value=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r9j:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="emotion-5"
+                              id="root_person_address__title"
+                            >
+                              <h5
+                                className="chakra-heading emotion-6"
+                              >
+                                address
+                              </h5>
+                              <span
+                                aria-orientation="horizontal"
+                                className="chakra-separator emotion-7"
+                                role="separator"
+                              />
+                            </div>
+                            <div
+                              className="emotion-2"
+                            >
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r9k:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r9l:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":r9l:"
+                                          id="field:::r9l:::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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r9m:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r9n:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":r9n:"
+                                          id="field:::r9n:::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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-35"
+  >
+    <button
+      className="chakra-button emotion-36"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+  position: relative;
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    gap: var(--chakra-spacing-1\\.5);
+    width: var(--chakra-sizes-full);
+    --select-trigger-height: var(--chakra-sizes-10);
+    --select-trigger-padding-x: var(--chakra-spacing-3);
+  }
+}
+
+@layer recipes {
+  .emotion-8 {
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-10 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    width: var(--chakra-sizes-full);
+    min-height: var(--select-trigger-height);
+    --input-height: var(--select-trigger-height);
+    padding-inline: var(--select-trigger-padding-x);
+    border-radius: var(--chakra-radii-l2);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    text-align: start;
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+  }
+
+  .emotion-10:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+
+  .emotion-10:is(:placeholder-shown, [data-placeholder-shown]) {
+    --mix-color: color-mix(in srgb, var(--chakra-colors-fg-muted) 80%, transparent);
+    color: var(--mix-color, var(--chakra-colors-fg-muted));
+  }
+
+  .emotion-10:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-10:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-10:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    border-color: var(--chakra-colors-border-emphasized);
+  }
+}
+
+@layer recipes {
+  .emotion-11 {
+    overflow: hidden;
+    display: -webkit-box;
+    -webkit-line-clamp: 1;
+    -webkit-box-orient: vertical;
+    text-wrap: wrap;
+    max-width: 80%;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-1);
+    position: absolute;
+    inset-inline-end: 0;
+    top: 0;
+    bottom: 0;
+    padding-inline: var(--select-trigger-padding-x);
+    pointer-events: none;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    color: var(--chakra-colors-fg-muted);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    color: var(--chakra-colors-fg-subtle);
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    color: var(--chakra-colors-fg-error);
+  }
+
+  .emotion-13 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+.emotion-14 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 2;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+.emotion-15 {
+  min-width: 100%!important;
+  z-index: 2!important;
+  top: calc(100% + 5px)!important;
+}
+
+@layer recipes {
+  .emotion-16 {
+    background: var(--chakra-colors-bg-panel);
+    --bg-currentcolor: var(--chakra-colors-bg-panel);
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    z-index: var(--chakra-z-index-dropdown);
+    border-radius: var(--chakra-radii-l2);
+    outline: 0;
+    max-height: var(--chakra-sizes-96);
+    overflow-y: auto;
+    box-shadow: var(--chakra-shadows-md);
+    padding: var(--chakra-spacing-1);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fast);
+    animation-duration: var(--chakra-durations-fast);
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=top] {
+    -webkit-animation-name: slide-from-bottom,fade-in;
+    animation-name: slide-from-bottom,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=bottom] {
+    -webkit-animation-name: slide-from-top,fade-in;
+    animation-name: slide-from-top,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=left] {
+    -webkit-animation-name: slide-from-right,fade-in;
+    animation-name: slide-from-right,fade-in;
+  }
+
+  .emotion-16:is([open], [data-open], [data-state=open])[data-placement^=right] {
+    -webkit-animation-name: slide-from-left,fade-in;
+    animation-name: slide-from-left,fade-in;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed]) {
+    transform-origin: var(--transform-origin);
+    -webkit-animation-duration: var(--chakra-durations-fastest);
+    animation-duration: var(--chakra-durations-fastest);
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=top] {
+    -webkit-animation-name: slide-to-bottom,fade-out;
+    animation-name: slide-to-bottom,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=bottom] {
+    -webkit-animation-name: slide-to-top,fade-out;
+    animation-name: slide-to-top,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=left] {
+    -webkit-animation-name: slide-to-right,fade-out;
+    animation-name: slide-to-right,fade-out;
+  }
+
+  .emotion-16:is([closed], [data-closed], [data-state=closed])[data-placement^=right] {
+    -webkit-animation-name: slide-to-left,fade-out;
+    animation-name: slide-to-left,fade-out;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    position: relative;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    gap: var(--chakra-spacing-2);
+    cursor: var(--chakra-cursor-option);
+    -webkit-box-pack: justify;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    -webkit-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    text-align: start;
+    border-radius: var(--chakra-radii-l1);
+    padding-block: var(--chakra-spacing-1\\.5);
+    padding-inline: var(--chakra-spacing-2);
+  }
+
+  .emotion-17[data-highlighted] {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-bg-emphasized) 60%, transparent);
+    background: var(--mix-background, var(--chakra-colors-bg-emphasized));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-bg-emphasized));
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    pointer-events: none;
+    opacity: 0.5;
+  }
+
+  .emotion-17 :where(svg) {
+    width: var(--chakra-sizes-4);
+    height: var(--chakra-sizes-4);
+  }
+}
+
+@layer recipes {
+  .emotion-18 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+  }
+}
+
+.emotion-26 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-27 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-27:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-27:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-27 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-27:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-27:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::rac:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::rad:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::rae:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":rae:"
+                      id="field:::rae:::label"
+                    >
+                      color
+                    </label>
+                    <div
+                      aria-describedby="root_color__error root_color__description root_color__help"
+                      autoFocus={false}
+                      className="chakra-select__root emotion-7"
+                      data-part="root"
+                      data-scope="select"
+                      dir="ltr"
+                      id="select:root_color"
+                      onBlur={[Function]}
+                      onFocus={[Function]}
+                    >
+                      <select
+                        aria-hidden={true}
+                        aria-labelledby="field:::rae:::label"
+                        disabled={false}
+                        id=":rae:"
+                        multiple={false}
+                        name="root.color"
+                        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",
+                          }
+                        }
+                        tabIndex={-1}
+                      >
+                        <option
+                          value=""
+                        />
+                        <option
+                          disabled={false}
+                          value="0"
+                        >
+                          red
+                        </option>
+                        <option
+                          disabled={false}
+                          value="1"
+                        >
+                          green
+                        </option>
+                        <option
+                          disabled={false}
+                          value="2"
+                        >
+                          blue
+                        </option>
+                      </select>
+                      <div
+                        className="chakra-select__control emotion-8"
+                        data-part="control"
+                        data-scope="select"
+                        data-state="closed"
+                        dir="ltr"
+                        id="select:root_color:control"
+                      >
+                        <div
+                          className="chakra-select__control emotion-8"
+                          data-part="control"
+                          data-scope="select"
+                          data-state="closed"
+                          dir="ltr"
+                          id="select:root_color:control"
+                        >
+                          <button
+                            aria-controls="select:root_color:content"
+                            aria-expanded={false}
+                            aria-haspopup="listbox"
+                            aria-invalid={false}
+                            aria-labelledby="field:::rae:::label"
+                            className="chakra-select__trigger emotion-10"
+                            data-part="trigger"
+                            data-placeholder-shown=""
+                            data-scope="select"
+                            data-state="closed"
+                            dir="ltr"
+                            disabled={false}
+                            id="select:root_color:trigger"
+                            onBlur={[Function]}
+                            onClick={[Function]}
+                            onFocus={[Function]}
+                            onKeyDown={[Function]}
+                            role="combobox"
+                            type="button"
+                          >
+                            <span
+                              className="chakra-select__valueText emotion-11"
+                              data-part="value-text"
+                              data-scope="select"
+                              dir="ltr"
+                            />
+                          </button>
+                          <div
+                            className="chakra-select__indicatorGroup emotion-12"
+                          >
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__indicator emotion-13"
+                              data-part="indicator"
+                              data-scope="select"
+                              data-state="closed"
+                              dir="ltr"
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="m6 9 6 6 6-6"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="chakra-select__positioner emotion-15"
+                        data-part="positioner"
+                        data-scope="select"
+                        dir="ltr"
+                        id="select:root_color:positioner"
+                        style={
+                          {
+                            "isolation": "isolate",
+                            "left": "0px",
+                            "maxHeight": undefined,
+                            "maxWidth": undefined,
+                            "minWidth": undefined,
+                            "pointerEvents": "none",
+                            "position": "absolute",
+                            "top": "0px",
+                            "transform": "translate3d(0, -100vh, 0)",
+                            "width": "var(--reference-width)",
+                            "zIndex": "var(--z-index)",
+                          }
+                        }
+                      >
+                        <div
+                          aria-labelledby="field:::rae:::label"
+                          className="chakra-select__content emotion-16"
+                          data-part="content"
+                          data-scope="select"
+                          data-state="closed"
+                          dir="ltr"
+                          hidden={true}
+                          id="select:root_color:content"
+                          onKeyDown={[Function]}
+                          role="listbox"
+                          tabIndex={0}
+                        >
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="0"
+                            dir="ltr"
+                            id="select:root_color:option:0"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            red
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="1"
+                            dir="ltr"
+                            id="select:root_color:option:1"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            green
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                          <div
+                            aria-selected={false}
+                            className="chakra-select__item emotion-17"
+                            data-part="item"
+                            data-scope="select"
+                            data-state="unchecked"
+                            data-value="2"
+                            dir="ltr"
+                            id="select:root_color:option:2"
+                            onClick={[Function]}
+                            onPointerLeave={[Function]}
+                            onPointerMove={[Function]}
+                            role="option"
+                          >
+                            blue
+                            <div
+                              aria-hidden={true}
+                              className="chakra-select__itemIndicator emotion-18"
+                              data-part="item-indicator"
+                              data-scope="select"
+                              data-state="unchecked"
+                              hidden={true}
+                            >
+                              <svg
+                                className="emotion-14"
+                                viewBox="0 0 24 24"
+                              >
+                                <path
+                                  d="M20 6 9 17l-5-5"
+                                />
+                              </svg>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-26"
+  >
+    <button
+      className="chakra-button emotion-27"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-16 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-17:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-17 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-17:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-17:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-18 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-19 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-20 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-21 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-21:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-21:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-21 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-21:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-21:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r95:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r96:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r97:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r97:"
+                      id="field:::r97:::label"
+                    >
+                      firstName
+                    </label>
+                    <input
+                      aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                      autoFocus={false}
+                      className="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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r98:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r99:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":r99:"
+                      id="field:::r99:::label"
+                    >
+                      age
+                    </label>
+                    <input
+                      aria-describedby="root_age__error root_age__description root_age__help"
+                      autoFocus={false}
+                      className="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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r9a:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r9b:"
+                    role="group"
+                  >
+                    <label
+                      aria-describedby="root_active__error root_active__description root_active__help"
+                      className="chakra-checkbox__root emotion-16"
+                      data-part="root"
+                      data-scope="checkbox"
+                      data-state="unchecked"
+                      dir="ltr"
+                      htmlFor=":r9b:"
+                      id="checkbox:root_active"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onPointerLeave={[Function]}
+                      onPointerMove={[Function]}
+                    >
+                      <input
+                        aria-invalid={false}
+                        aria-labelledby="field:::r9b:::label"
+                        defaultChecked={false}
+                        disabled={false}
+                        id=":r9b:"
+                        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",
+                          }
+                        }
+                        type="checkbox"
+                        value="on"
+                      />
+                      <div
+                        aria-hidden={true}
+                        className="chakra-checkbox__control emotion-17"
+                        data-part="control"
+                        data-scope="checkbox"
+                        data-state="unchecked"
+                        dir="ltr"
+                        id="checkbox:root_active:control"
+                      >
+                        <svg
+                          className="emotion-18"
+                          data-state="unchecked"
+                          viewBox="0 0 24 24"
+                        />
+                      </div>
+                      <span
+                        className="chakra-checkbox__label emotion-19"
+                        data-part="label"
+                        data-scope="checkbox"
+                        data-state="unchecked"
+                        dir="ltr"
+                        id="field:::r9b:::label"
+                      >
+                        <p>
+                          active
+                        </p>
+                      </span>
+                    </label>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-20"
+  >
+    <button
+      className="chakra-button emotion-21"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 @layer recipes {
   .emotion-0 {
diff --git a/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap b/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
index 348842f1a1..b646e67be0 100644
--- a/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/chakra-ui/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,4761 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-11 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-35 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-36 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-36:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-36:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-36 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-36:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-36:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r24:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r25:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="emotion-5"
+                    id="root_person__title"
+                  >
+                    <h5
+                      className="chakra-heading emotion-6"
+                    >
+                      person
+                    </h5>
+                    <span
+                      aria-orientation="horizontal"
+                      className="chakra-separator emotion-7"
+                      role="separator"
+                    />
+                  </div>
+                  <div
+                    className="emotion-2"
+                  >
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r26:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r27:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":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"
+                                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=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r28:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="emotion-5"
+                              id="root_person_address__title"
+                            >
+                              <h5
+                                className="chakra-heading emotion-6"
+                              >
+                                address
+                              </h5>
+                              <span
+                                aria-orientation="horizontal"
+                                className="chakra-separator emotion-7"
+                                role="separator"
+                              />
+                            </div>
+                            <div
+                              className="emotion-2"
+                            >
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r29:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r2a:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r2b:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r2c:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r2d:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r2e:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-35"
+  >
+    <button
+      className="chakra-button emotion-36"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-8 {
+  display: grid;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  gap: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-9 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+.emotion-11 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-11 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-11:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-11:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-11:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-17 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-17:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-17 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-17:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-17:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-17 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-18 {
+  justify-self: flex-end;
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-19:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-19 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-19:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-19:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-20 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r2f:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r2g:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r2h:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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"
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string emotion-8"
+            >
+              <div>
+                <div
+                  className="chakra-field__root emotion-9"
+                  data-part="root"
+                  data-scope="field"
+                  id="field:::r2i:"
+                  role="group"
+                >
+                  <label
+                    className="chakra-field__label emotion-6"
+                    data-part="label"
+                    data-scope="field"
+                    htmlFor=":r2i:"
+                    id="field:::r2i:::label"
+                  >
+                    customField Key
+                  </label>
+                  <input
+                    className="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"
+                  />
+                </div>
+              </div>
+              <div>
+                <fieldset
+                  aria-labelledby="fieldset:::r2j:::legend"
+                  className="fieldset__root emotion-0"
+                  data-part="root"
+                  data-scope="fieldset"
+                  disabled={false}
+                >
+                  <div
+                    className="fieldset__content emotion-1"
+                  >
+                    <div
+                      className="chakra-field__root emotion-5"
+                      data-part="root"
+                      data-scope="field"
+                      id="field:::r2k:"
+                      role="group"
+                    >
+                      <label
+                        className="chakra-field__label emotion-6"
+                        data-part="label"
+                        data-scope="field"
+                        htmlFor=":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"
+                        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"
+                      />
+                    </div>
+                  </div>
+                </fieldset>
+              </div>
+              <div>
+                <button
+                  aria-label="Remove"
+                  className="chakra-button rjsf-object-property-remove emotion-17"
+                  disabled={false}
+                  id="root_customField__remove"
+                  onClick={[Function]}
+                  title="Remove"
+                  type="button"
+                >
+                  <svg
+                    aria-hidden="true"
+                    className="lucide lucide-delete"
+                    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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                    />
+                    <path
+                      d="m12 9 6 6"
+                    />
+                    <path
+                      d="m18 9-6 6"
+                    />
+                  </svg>
+                </button>
+              </div>
+            </div>
+          </div>
+          <div
+            className="emotion-18"
+          >
+            <button
+              className="chakra-button rjsf-object-property-expand emotion-19"
+              disabled={false}
+              id="root__add"
+              onClick={[Function]}
+              type="button"
+            >
+              <svg
+                aria-hidden="true"
+                className="lucide lucide-plus"
+                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="M5 12h14"
+                />
+                <path
+                  d="M12 5v14"
+                />
+              </svg>
+              Add Item
+            </button>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-20"
+  >
+    <button
+      className="chakra-button emotion-19"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+@layer recipes {
+  .emotion-16 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: var(--chakra-spacing-2\\.5);
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    vertical-align: top;
+    position: relative;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    color: var(--chakra-colors-white);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border-emphasized);
+    border-radius: var(--chakra-radii-l1);
+    cursor: var(--chakra-cursor-checkbox);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+    padding: var(--chakra-spacing-0\\.5);
+  }
+
+  .emotion-17:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-17 :where(svg) {
+    width: var(--chakra-sizes-full);
+    height: var(--chakra-sizes-full);
+  }
+
+  .emotion-17:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --chakra-colors-color-palette-50: var(--chakra-colors-red-50);
+    --chakra-colors-color-palette-100: var(--chakra-colors-red-100);
+    --chakra-colors-color-palette-200: var(--chakra-colors-red-200);
+    --chakra-colors-color-palette-300: var(--chakra-colors-red-300);
+    --chakra-colors-color-palette-400: var(--chakra-colors-red-400);
+    --chakra-colors-color-palette-500: var(--chakra-colors-red-500);
+    --chakra-colors-color-palette-600: var(--chakra-colors-red-600);
+    --chakra-colors-color-palette-700: var(--chakra-colors-red-700);
+    --chakra-colors-color-palette-800: var(--chakra-colors-red-800);
+    --chakra-colors-color-palette-900: var(--chakra-colors-red-900);
+    --chakra-colors-color-palette-950: var(--chakra-colors-red-950);
+    --chakra-colors-color-palette-contrast: var(--chakra-colors-red-contrast);
+    --chakra-colors-color-palette-fg: var(--chakra-colors-red-fg);
+    --chakra-colors-color-palette-subtle: var(--chakra-colors-red-subtle);
+    --chakra-colors-color-palette-muted: var(--chakra-colors-red-muted);
+    --chakra-colors-color-palette-emphasized: var(--chakra-colors-red-emphasized);
+    --chakra-colors-color-palette-solid: var(--chakra-colors-red-solid);
+    --chakra-colors-color-palette-focus-ring: var(--chakra-colors-red-focus-ring);
+    border-color: var(--chakra-colors-border-error);
+  }
+
+  .emotion-17:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: var(--chakra-cursor-disabled);
+  }
+
+  .emotion-17:is([data-state=checked], [data-state=indeterminate]) {
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+    border-color: var(--chakra-colors-color-palette-solid);
+  }
+}
+
+.emotion-18 {
+  fill: none;
+  stroke: currentColor;
+  stroke-width: 3px;
+  stroke-linecap: round;
+  stroke-linejoin: round;
+}
+
+@layer recipes {
+  .emotion-19 {
+    font-weight: var(--chakra-font-weights-medium);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+.emotion-22 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-23 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-24 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-25 {
+  display: grid;
+}
+
+.emotion-26 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-27 {
+  width: 100%;
+}
+
+@layer recipes {
+  .emotion-32 {
+    color: var(--chakra-colors-fg-error);
+    line-height: 1;
+  }
+}
+
+.emotion-34 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-34 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-34 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-34>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-34>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-34>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-35 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-35 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-35:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-35:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-35 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-35:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-35:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-35 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-50 {
+  justify-self: flex-end;
+}
+
+.emotion-51 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-52 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-52:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-52:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-52 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-52:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-52:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-53 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r2l:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r2m:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r2n:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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"
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r2o:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r2p:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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}
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r2q:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r2r:"
+                    role="group"
+                  >
+                    <label
+                      aria-describedby="root_active__error root_active__description root_active__help"
+                      className="chakra-checkbox__root emotion-16"
+                      data-part="root"
+                      data-scope="checkbox"
+                      data-state="checked"
+                      dir="ltr"
+                      htmlFor=":r2r:"
+                      id="checkbox:root_active"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onPointerLeave={[Function]}
+                      onPointerMove={[Function]}
+                    >
+                      <input
+                        aria-invalid={false}
+                        aria-labelledby="field:::r2r:::label"
+                        defaultChecked={true}
+                        disabled={false}
+                        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",
+                          }
+                        }
+                        type="checkbox"
+                        value="on"
+                      />
+                      <div
+                        aria-hidden={true}
+                        className="chakra-checkbox__control emotion-17"
+                        data-part="control"
+                        data-scope="checkbox"
+                        data-state="checked"
+                        dir="ltr"
+                        id="checkbox:root_active:control"
+                      >
+                        <svg
+                          className="emotion-18"
+                          data-state="checked"
+                          viewBox="0 0 24 24"
+                        >
+                          <polyline
+                            points="20 6 9 17 4 12"
+                          />
+                        </svg>
+                      </div>
+                      <span
+                        className="chakra-checkbox__label emotion-19"
+                        data-part="label"
+                        data-scope="checkbox"
+                        data-state="checked"
+                        dir="ltr"
+                        id="field:::r2r:::label"
+                      >
+                        <p>
+                          active
+                        </p>
+                      </span>
+                    </label>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r2t:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-22"
+                      id="root_tags__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-23"
+                      >
+                        tags
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-24"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-25"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-26"
+                        >
+                          <div
+                            className="emotion-27"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r2u:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-5"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r2v:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-6"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r2v:"
+                                      id="field:::r2v:::label"
+                                    >
+                                      tags-0
+                                      <span
+                                        aria-hidden="true"
+                                        className="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"
+                                      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}
+                                      type="text"
+                                      value="developer"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-34"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-35"
+                                disabled={true}
+                                id="root_tags_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-35"
+                                disabled={false}
+                                id="root_tags_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-35"
+                                disabled={false}
+                                id="root_tags_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-26"
+                        >
+                          <div
+                            className="emotion-27"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r30:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-5"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r31:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-6"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r31:"
+                                      id="field:::r31:::label"
+                                    >
+                                      tags-1
+                                      <span
+                                        aria-hidden="true"
+                                        className="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"
+                                      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}
+                                      type="text"
+                                      value="designer"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-34"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-35"
+                                disabled={false}
+                                id="root_tags_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-35"
+                                disabled={true}
+                                id="root_tags_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-35"
+                                disabled={false}
+                                id="root_tags_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-50"
+                      >
+                        <div
+                          className="emotion-51"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-52"
+                            disabled={false}
+                            id="root_tags__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-53"
+  >
+    <button
+      className="chakra-button emotion-52"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-18 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-19:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-19 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-19:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-19:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r1t:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r1u:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r1v:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r20:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r21:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r22:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r23:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-18"
+  >
+    <button
+      className="chakra-button emotion-19"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-6 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-11 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-11 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-12 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-12:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-13 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-13:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-13:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-13:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-30 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-31 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-31:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-31:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-31 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-31:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-31:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r39:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r3a:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="emotion-5"
+                    id="root_person__title"
+                  >
+                    <h5
+                      className="chakra-heading emotion-6"
+                    >
+                      person
+                    </h5>
+                    <span
+                      aria-orientation="horizontal"
+                      className="chakra-separator emotion-7"
+                      role="separator"
+                    />
+                  </div>
+                  <div
+                    className="emotion-2"
+                  >
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r3b:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="chakra-field__root emotion-11"
+                              data-part="root"
+                              data-scope="field"
+                              id="field:::r3c:"
+                              role="group"
+                            >
+                              <label
+                                className="chakra-field__label emotion-12"
+                                data-part="label"
+                                data-scope="field"
+                                htmlFor=":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"
+                                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=""
+                              />
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                    <div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <fieldset
+                          aria-labelledby="fieldset:::r3d:::legend"
+                          className="fieldset__root emotion-0"
+                          data-part="root"
+                          data-scope="fieldset"
+                          disabled={false}
+                        >
+                          <div
+                            className="fieldset__content emotion-1"
+                          >
+                            <div
+                              className="emotion-5"
+                              id="root_person_address__title"
+                            >
+                              <h5
+                                className="chakra-heading emotion-6"
+                              >
+                                address
+                              </h5>
+                              <span
+                                aria-orientation="horizontal"
+                                className="chakra-separator emotion-7"
+                                role="separator"
+                              />
+                            </div>
+                            <div
+                              className="emotion-2"
+                            >
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r3e:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r3f:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                              <div>
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <fieldset
+                                    aria-labelledby="fieldset:::r3g:::legend"
+                                    className="fieldset__root emotion-0"
+                                    data-part="root"
+                                    data-scope="fieldset"
+                                    disabled={false}
+                                  >
+                                    <div
+                                      className="fieldset__content emotion-1"
+                                    >
+                                      <div
+                                        className="chakra-field__root emotion-11"
+                                        data-part="root"
+                                        data-scope="field"
+                                        id="field:::r3h:"
+                                        role="group"
+                                      >
+                                        <label
+                                          className="chakra-field__label emotion-12"
+                                          data-part="label"
+                                          data-scope="field"
+                                          htmlFor=":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"
+                                          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=""
+                                        />
+                                      </div>
+                                    </div>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </fieldset>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-30"
+  >
+    <button
+      className="chakra-button emotion-31"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-15 {
+  margin-top: var(--chakra-spacing-1);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+@layer recipes {
+  .emotion-16 {
+    font-family: var(--chakra-fonts-heading);
+    font-weight: var(--chakra-font-weights-semibold);
+    font-size: var(--chakra-font-sizes-xl);
+    line-height: 1.875rem;
+  }
+}
+
+@layer recipes {
+  .emotion-17 {
+    display: block;
+    border-color: var(--chakra-colors-border);
+    --separator-thickness: 1px;
+    border-style: solid;
+    border-top-width: var(--separator-thickness);
+  }
+}
+
+.emotion-18 {
+  display: grid;
+}
+
+.emotion-19 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-align-items: flex-end;
+  -webkit-box-align: flex-end;
+  -ms-flex-align: flex-end;
+  align-items: flex-end;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  gap: 0.5rem;
+  padding-block: var(--chakra-spacing-1);
+}
+
+.emotion-20 {
+  width: 100%;
+}
+
+@layer recipes {
+  .emotion-25 {
+    color: var(--chakra-colors-fg-error);
+    line-height: 1;
+  }
+}
+
+.emotion-27 {
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: start;
+  -ms-flex-pack: start;
+  -webkit-justify-content: flex-start;
+  justify-content: flex-start;
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-27 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    gap: 0!important;
+    isolation: isolate;
+    position: relative;
+    -webkit-flex-direction: row;
+    -ms-flex-direction: row;
+    flex-direction: row;
+  }
+
+  .emotion-27 [data-group-item]:is(:focus-visible, [data-focus-visible]) {
+    z-index: 1;
+  }
+
+  .emotion-27>*[data-first] {
+    border-start-end-radius: 0!important;
+    border-end-end-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-27>*[data-between] {
+    border-radius: 0!important;
+    -webkit-margin-end: -1px;
+    margin-inline-end: -1px;
+  }
+
+  .emotion-27>*[data-last] {
+    border-start-start-radius: 0!important;
+    border-end-start-radius: 0!important;
+  }
+}
+
+.emotion-28 {
+  padding-inline: 0;
+  padding-block: 0;
+}
+
+@layer recipes {
+  .emotion-28 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-28:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-28:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-28 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-28:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-28:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-28 :where(svg) {
+  font-size: 1.2em;
+}
+
+.emotion-43 {
+  justify-self: flex-end;
+}
+
+.emotion-44 {
+  margin-top: var(--chakra-spacing-2);
+}
+
+@layer recipes {
+  .emotion-45 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-45:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-45:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-45 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-45:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-45:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+.emotion-46 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r3i:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r3j:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r3k:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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"
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r3l:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r3m:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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}
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r3n:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div>
+                    <div
+                      className="emotion-15"
+                      id="root_items__title"
+                    >
+                      <h5
+                        className="chakra-heading emotion-16"
+                      >
+                        items
+                      </h5>
+                      <span
+                        aria-orientation="horizontal"
+                        className="chakra-separator emotion-17"
+                        role="separator"
+                      />
+                    </div>
+                    <div
+                      className="emotion-18"
+                    >
+                      <div>
+                        <div
+                          className="chakra-stack emotion-19"
+                        >
+                          <div
+                            className="emotion-20"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r3o:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-5"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r3p:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-6"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r3p:"
+                                      id="field:::r3p:::label"
+                                    >
+                                      items-0
+                                      <span
+                                        aria-hidden="true"
+                                        className="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"
+                                      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}
+                                      type="text"
+                                      value="a"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-27"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-28"
+                                disabled={true}
+                                id="root_items_0__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-28"
+                                disabled={false}
+                                id="root_items_0__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-28"
+                                disabled={false}
+                                id="root_items_0__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="chakra-stack emotion-19"
+                        >
+                          <div
+                            className="emotion-20"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <fieldset
+                                aria-labelledby="fieldset:::r3q:::legend"
+                                className="fieldset__root emotion-0"
+                                data-part="root"
+                                data-scope="fieldset"
+                                disabled={false}
+                              >
+                                <div
+                                  className="fieldset__content emotion-1"
+                                >
+                                  <div
+                                    className="chakra-field__root emotion-5"
+                                    data-part="root"
+                                    data-scope="field"
+                                    id="field:::r3r:"
+                                    role="group"
+                                  >
+                                    <label
+                                      className="chakra-field__label emotion-6"
+                                      data-part="label"
+                                      data-required=""
+                                      data-scope="field"
+                                      htmlFor=":r3r:"
+                                      id="field:::r3r:::label"
+                                    >
+                                      items-1
+                                      <span
+                                        aria-hidden="true"
+                                        className="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"
+                                      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}
+                                      type="text"
+                                      value="b"
+                                    />
+                                  </div>
+                                </div>
+                              </fieldset>
+                            </div>
+                          </div>
+                          <div>
+                            <div
+                              className="chakra-group emotion-27"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="chakra-button rjsf-array-item-move-up emotion-28"
+                                disabled={false}
+                                id="root_items_1__moveUp"
+                                onClick={[Function]}
+                                title="Move up"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-up"
+                                  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="m5 12 7-7 7 7"
+                                  />
+                                  <path
+                                    d="M12 19V5"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Move down"
+                                className="chakra-button rjsf-array-item-move-down emotion-28"
+                                disabled={true}
+                                id="root_items_1__moveDown"
+                                onClick={[Function]}
+                                title="Move down"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-arrow-down"
+                                  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="M12 5v14"
+                                  />
+                                  <path
+                                    d="m19 12-7 7-7-7"
+                                  />
+                                </svg>
+                              </button>
+                              <button
+                                aria-label="Remove"
+                                className="chakra-button rjsf-array-item-remove emotion-28"
+                                disabled={false}
+                                id="root_items_1__remove"
+                                onClick={[Function]}
+                                title="Remove"
+                                type="button"
+                              >
+                                <svg
+                                  aria-hidden="true"
+                                  className="lucide lucide-delete"
+                                  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 5a2 2 0 0 0-1.344.519l-6.328 5.74a1 1 0 0 0 0 1.481l6.328 5.741A2 2 0 0 0 10 19h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2z"
+                                  />
+                                  <path
+                                    d="m12 9 6 6"
+                                  />
+                                  <path
+                                    d="m18 9-6 6"
+                                  />
+                                </svg>
+                              </button>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="emotion-43"
+                      >
+                        <div
+                          className="emotion-44"
+                        >
+                          <button
+                            className="chakra-button rjsf-array-item-add emotion-45"
+                            disabled={false}
+                            id="root_items__add"
+                            onClick={[Function]}
+                            type="button"
+                          >
+                            <svg
+                              aria-hidden="true"
+                              className="lucide lucide-plus"
+                              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="M5 12h14"
+                              />
+                              <path
+                                d="M12 5v14"
+                              />
+                            </svg>
+                            Add Item
+                          </button>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-46"
+  >
+    <button
+      className="chakra-button emotion-45"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+@layer recipes {
+  .emotion-0 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+  }
+
+  .emotion-0>:not(style, [hidden])~:not(style, [hidden]) {
+    --space-y-reverse: 0;
+    margin-top: calc(var(--chakra-spacing-4) * calc(1 - var(--space-y-reverse)));
+    margin-bottom: calc(var(--chakra-spacing-4) * var(--space-y-reverse));
+  }
+}
+
+@layer recipes {
+  .emotion-1 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    width: var(--chakra-sizes-full);
+    gap: var(--chakra-spacing-4);
+  }
+}
+
+.emotion-2 {
+  display: grid;
+  gap: var(--chakra-spacing-4);
+  margin-bottom: var(--chakra-spacing-4);
+}
+
+.emotion-5 {
+  margin-bottom: var(--chakra-spacing-1);
+}
+
+@layer recipes {
+  .emotion-5 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    width: 100%;
+    position: relative;
+    gap: var(--chakra-spacing-1\\.5);
+    -webkit-flex-direction: column;
+    -ms-flex-direction: column;
+    flex-direction: column;
+    -webkit-align-items: flex-start;
+    -webkit-box-align: flex-start;
+    -ms-flex-align: flex-start;
+    align-items: flex-start;
+  }
+}
+
+@layer recipes {
+  .emotion-6 {
+    display: -webkit-box;
+    display: -webkit-flex;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-align: start;
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    font-weight: var(--chakra-font-weights-medium);
+    gap: var(--chakra-spacing-1);
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+  }
+
+  .emotion-6:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+  }
+}
+
+@layer recipes {
+  .emotion-7 {
+    width: 100%;
+    min-width: var(--input-height);
+    outline: 0;
+    position: relative;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    text-align: start;
+    border-radius: var(--chakra-radii-l2);
+    height: var(--input-height);
+    --focus-color: var(--chakra-colors-color-palette-focus-ring);
+    --error-color: var(--chakra-colors-border-error);
+    font-size: var(--chakra-font-sizes-sm);
+    line-height: 1.25rem;
+    padding-inline: var(--chakra-spacing-3);
+    --input-height: var(--chakra-sizes-10);
+    background: var(--chakra-colors-transparent);
+    --bg-currentcolor: var(--chakra-colors-transparent);
+    border-width: 1px;
+    border-color: var(--chakra-colors-border);
+    --focus-ring-color: var(--focus-color);
+  }
+
+  .emotion-7:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-7:is([data-invalid], [aria-invalid=true], [data-state=invalid]) {
+    --focus-ring-color: var(--error-color);
+    border-color: var(--error-color);
+  }
+
+  .emotion-7:is(:focus-visible, [data-focus-visible]) {
+    outline-offset: 0px;
+    outline-width: var(--focus-ring-width, 1px);
+    outline-color: var(--focus-ring-color);
+    outline-style: var(--focus-ring-style, solid);
+    border-color: var(--focus-ring-color);
+  }
+}
+
+.emotion-18 {
+  margin-top: var(--chakra-spacing-3);
+}
+
+@layer recipes {
+  .emotion-19 {
+    display: -webkit-inline-box;
+    display: -webkit-inline-flex;
+    display: -ms-inline-flexbox;
+    display: inline-flex;
+    -webkit-appearance: none;
+    -moz-appearance: none;
+    -ms-appearance: none;
+    appearance: none;
+    -webkit-align-items: center;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    -webkit-box-pack: center;
+    -ms-flex-pack: center;
+    -webkit-justify-content: center;
+    justify-content: center;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    position: relative;
+    border-radius: var(--chakra-radii-l2);
+    white-space: nowrap;
+    vertical-align: middle;
+    border-width: 1px;
+    border-color: var(--chakra-colors-transparent);
+    cursor: var(--chakra-cursor-button);
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    outline: 0;
+    line-height: 1.25rem;
+    isolation: isolate;
+    font-weight: var(--chakra-font-weights-medium);
+    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,translate,transform;
+    transition-duration: var(--chakra-durations-moderate);
+    --focus-ring-color: var(--chakra-colors-color-palette-focus-ring);
+    height: var(--chakra-sizes-10);
+    min-width: var(--chakra-sizes-10);
+    font-size: var(--chakra-font-sizes-sm);
+    padding-inline: var(--chakra-spacing-4);
+    gap: var(--chakra-spacing-2);
+    background: var(--chakra-colors-color-palette-solid);
+    --bg-currentcolor: var(--chakra-colors-color-palette-solid);
+    color: var(--chakra-colors-color-palette-contrast);
+  }
+
+  .emotion-19:is(:focus-visible, [data-focus-visible]) {
+    outline-width: var(--focus-ring-width, 2px);
+    outline-offset: var(--focus-ring-offset, 2px);
+    outline-style: var(--focus-ring-style, solid);
+    outline-color: var(--focus-ring-color);
+  }
+
+  .emotion-19:is(:disabled, [disabled], [data-disabled], [aria-disabled=true]) {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .emotion-19 :where(svg) {
+    -webkit-flex-shrink: 0;
+    -ms-flex-negative: 0;
+    flex-shrink: 0;
+    width: var(--chakra-sizes-5);
+    height: var(--chakra-sizes-5);
+  }
+
+  .emotion-19:is([aria-expanded=true], [data-expanded], [data-state=expanded]) {
+    --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+    background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+  }
+
+  @media (hover: hover) {
+    .emotion-19:is(:hover, [data-hover]):not(:disabled, [data-disabled]) {
+      --mix-background: color-mix(in srgb, var(--chakra-colors-color-palette-solid) 90%, transparent);
+      background: var(--mix-background, var(--chakra-colors-color-palette-solid));
+      --bg-currentcolor: var(--mix-background, var(--chakra-colors-color-palette-solid));
+    }
+  }
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      aria-labelledby="fieldset:::r32:::legend"
+      className="fieldset__root emotion-0"
+      data-part="root"
+      data-scope="fieldset"
+      disabled={false}
+    >
+      <div
+        className="fieldset__content emotion-1"
+      >
+        <div
+          className="emotion-2"
+        >
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r33:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r34:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r35:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r36:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div>
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <fieldset
+                aria-labelledby="fieldset:::r37:::legend"
+                className="fieldset__root emotion-0"
+                data-part="root"
+                data-scope="fieldset"
+                disabled={false}
+              >
+                <div
+                  className="fieldset__content emotion-1"
+                >
+                  <div
+                    className="chakra-field__root emotion-5"
+                    data-part="root"
+                    data-scope="field"
+                    id="field:::r38:"
+                    role="group"
+                  >
+                    <label
+                      className="chakra-field__label emotion-6"
+                      data-part="label"
+                      data-scope="field"
+                      htmlFor=":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"
+                      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=""
+                    />
+                  </div>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div
+    className="emotion-18"
+  >
+    <button
+      className="chakra-button emotion-19"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 @layer recipes {
   .emotion-0 {
diff --git a/packages/core/test/Form.test.jsx b/packages/core/test/Form.test.jsx
index 882438b13f..960a31c34a 100644
--- a/packages/core/test/Form.test.jsx
+++ b/packages/core/test/Form.test.jsx
@@ -5222,4 +5222,256 @@ describe('Form omitExtraData and liveOmit', () => {
       expect(testInput).eql(null);
     });
   });
+
+  describe('nameGenerator', () => {
+    const { bracketNameGenerator, dotNotationNameGenerator } = require('@rjsf/utils');
+
+    it('should generate bracket notation names for simple fields', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          firstName: { type: 'string' },
+          lastName: { type: 'string' },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: bracketNameGenerator });
+
+      const firstNameInput = node.querySelector('#root_firstName');
+      const lastNameInput = node.querySelector('#root_lastName');
+
+      expect(firstNameInput.getAttribute('name')).eql('root[firstName]');
+      expect(lastNameInput.getAttribute('name')).eql('root[lastName]');
+    });
+
+    it('should generate dot notation names for simple fields', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          firstName: { type: 'string' },
+          lastName: { type: 'string' },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: dotNotationNameGenerator });
+
+      const firstNameInput = node.querySelector('#root_firstName');
+      const lastNameInput = node.querySelector('#root_lastName');
+
+      expect(firstNameInput.getAttribute('name')).eql('root.firstName');
+      expect(lastNameInput.getAttribute('name')).eql('root.lastName');
+    });
+
+    it('should generate bracket notation names for nested objects', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          person: {
+            type: 'object',
+            properties: {
+              firstName: { type: 'string' },
+              address: {
+                type: 'object',
+                properties: {
+                  street: { type: 'string' },
+                  city: { type: 'string' },
+                },
+              },
+            },
+          },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: bracketNameGenerator });
+
+      const firstNameInput = node.querySelector('#root_person_firstName');
+      const streetInput = node.querySelector('#root_person_address_street');
+      const cityInput = node.querySelector('#root_person_address_city');
+
+      expect(firstNameInput.getAttribute('name')).eql('root[person][firstName]');
+      expect(streetInput.getAttribute('name')).eql('root[person][address][street]');
+      expect(cityInput.getAttribute('name')).eql('root[person][address][city]');
+    });
+
+    it('should generate bracket notation names for array items', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          tags: {
+            type: 'array',
+            items: { type: 'string' },
+          },
+        },
+      };
+      const formData = {
+        tags: ['foo', 'bar'],
+      };
+      const { node } = createFormComponent({ schema, formData, nameGenerator: bracketNameGenerator });
+
+      const firstTagInput = node.querySelector('#root_tags_0');
+      const secondTagInput = node.querySelector('#root_tags_1');
+
+      expect(firstTagInput.getAttribute('name')).eql('root[tags][0]');
+      expect(secondTagInput.getAttribute('name')).eql('root[tags][1]');
+    });
+
+    it('should generate bracket notation names for array of objects', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          tasks: {
+            type: 'array',
+            items: {
+              type: 'object',
+              properties: {
+                title: { type: 'string' },
+                done: { type: 'boolean' },
+              },
+            },
+          },
+        },
+      };
+      const formData = {
+        tasks: [
+          { title: 'Task 1', done: false },
+          { title: 'Task 2', done: true },
+        ],
+      };
+      const { node } = createFormComponent({ schema, formData, nameGenerator: bracketNameGenerator });
+
+      const firstTaskTitleInput = node.querySelector('#root_tasks_0_title');
+      const firstTaskDoneInput = node.querySelector('#root_tasks_0_done');
+      const secondTaskTitleInput = node.querySelector('#root_tasks_1_title');
+      const secondTaskDoneInput = node.querySelector('#root_tasks_1_done');
+
+      expect(firstTaskTitleInput.getAttribute('name')).eql('root[tasks][0][title]');
+      expect(firstTaskDoneInput.getAttribute('name')).eql('root[tasks][0][done]');
+      expect(secondTaskTitleInput.getAttribute('name')).eql('root[tasks][1][title]');
+      expect(secondTaskDoneInput.getAttribute('name')).eql('root[tasks][1][done]');
+    });
+
+    it('should generate bracket notation names for select widgets', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          color: {
+            type: 'string',
+            enum: ['red', 'green', 'blue'],
+          },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: bracketNameGenerator });
+
+      const selectInput = node.querySelector('#root_color');
+      expect(selectInput.getAttribute('name')).eql('root[color]');
+    });
+
+    it('should generate bracket notation names for radio widgets', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          option: {
+            type: 'string',
+            enum: ['foo', 'bar'],
+          },
+        },
+      };
+      const uiSchema = {
+        option: {
+          'ui:widget': 'radio',
+        },
+      };
+      const { node } = createFormComponent({ schema, uiSchema, nameGenerator: bracketNameGenerator });
+
+      const radioInputs = node.querySelectorAll('input[type="radio"]');
+      expect(radioInputs[0].getAttribute('name')).eql('root[option]');
+      expect(radioInputs[1].getAttribute('name')).eql('root[option]');
+    });
+
+    it('should generate bracket notation names for checkboxes widgets', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          choices: {
+            type: 'array',
+            items: {
+              type: 'string',
+              enum: ['foo', 'bar', 'baz'],
+            },
+            uniqueItems: true,
+          },
+        },
+      };
+      const uiSchema = {
+        choices: {
+          'ui:widget': 'checkboxes',
+        },
+      };
+      const { node } = createFormComponent({ schema, uiSchema, nameGenerator: bracketNameGenerator });
+
+      const checkboxInputs = node.querySelectorAll('input[type="checkbox"]');
+      // Checkboxes for multi-value fields have [] appended to indicate multiple values
+      expect(checkboxInputs[0].getAttribute('name')).eql('root[choices][]');
+      expect(checkboxInputs[1].getAttribute('name')).eql('root[choices][]');
+      expect(checkboxInputs[2].getAttribute('name')).eql('root[choices][]');
+    });
+
+    it('should generate bracket notation names for textarea widgets', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          description: { type: 'string' },
+        },
+      };
+      const uiSchema = {
+        description: {
+          'ui:widget': 'textarea',
+        },
+      };
+      const { node } = createFormComponent({ schema, uiSchema, nameGenerator: bracketNameGenerator });
+
+      const textareaInput = node.querySelector('#root_description');
+      expect(textareaInput.getAttribute('name')).eql('root[description]');
+    });
+
+    it('should use default id if nameGenerator is not provided', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          firstName: { type: 'string' },
+        },
+      };
+      const { node } = createFormComponent({ schema });
+
+      const firstNameInput = node.querySelector('#root_firstName');
+      expect(firstNameInput.getAttribute('name')).eql('root_firstName');
+    });
+
+    it('should handle nameGenerator with number fields', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          age: { type: 'number' },
+          count: { type: 'integer' },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: bracketNameGenerator });
+
+      const ageInput = node.querySelector('#root_age');
+      const countInput = node.querySelector('#root_count');
+
+      expect(ageInput.getAttribute('name')).eql('root[age]');
+      expect(countInput.getAttribute('name')).eql('root[count]');
+    });
+
+    it('should handle nameGenerator with boolean fields', () => {
+      const schema = {
+        type: 'object',
+        properties: {
+          active: { type: 'boolean' },
+        },
+      };
+      const { node } = createFormComponent({ schema, nameGenerator: bracketNameGenerator });
+
+      const activeInput = node.querySelector('#root_active');
+      expect(activeInput.getAttribute('name')).eql('root[active]');
+    });
+  });
 });
diff --git a/packages/core/test/__snapshots__/ArraySnap.test.tsx.snap b/packages/core/test/__snapshots__/ArraySnap.test.tsx.snap
index 65ea626020..023d340c17 100644
--- a/packages/core/test/__snapshots__/ArraySnap.test.tsx.snap
+++ b/packages/core/test/__snapshots__/ArraySnap.test.tsx.snap
@@ -619,6 +619,1734 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_0"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_0_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_0_name"
+                    label="name"
+                    name="root[0][name]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    type="text"
+                    value="Item 1"
+                  />
+                </div>
+                <div
+                  className="form-group rjsf-field rjsf-field-number"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_0_value"
+                  >
+                    value
+                  </label>
+                  <input
+                    aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_0_value"
+                    label="value"
+                    name="root[0][value]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    step="any"
+                    type="number"
+                    value={10}
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={true}
+                id="root_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_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_0__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_1"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_1_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_1_name"
+                    label="name"
+                    name="root[1][name]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    type="text"
+                    value="Item 2"
+                  />
+                </div>
+                <div
+                  className="form-group rjsf-field rjsf-field-number"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_1_value"
+                  >
+                    value
+                  </label>
+                  <input
+                    aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_1_value"
+                    label="value"
+                    name="root[1][value]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    step="any"
+                    type="number"
+                    value={20}
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={false}
+                id="root_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_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_1__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <p
+          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+        >
+          <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-string"
+            >
+              <input
+                aria-describedby="root_0__error root_0__description root_0__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_0"
+                label=""
+                name="root[0]"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={true}
+                id="root_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_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_0__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-string"
+            >
+              <input
+                aria-describedby="root_1__error root_1__description root_1__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_1"
+                label=""
+                name="root[1]"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                type="text"
+                value="bar"
+              />
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={false}
+                id="root_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_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_1__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <p
+          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+        >
+          <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <select
+      aria-describedby="root__error root__description root__help"
+      autoFocus={false}
+      className="form-control"
+      disabled={false}
+      id="root"
+      multiple={true}
+      name="root"
+      onBlur={[Function]}
+      onChange={[Function]}
+      onFocus={[Function]}
+      required={false}
+      role="combobox"
+      value={[]}
+    >
+      <option
+        value="0"
+      >
+        foo
+      </option>
+      <option
+        value="1"
+      >
+        bar
+      </option>
+      <option
+        value="2"
+      >
+        baz
+      </option>
+    </select>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-fixed-items"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-12"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-string"
+            >
+              <input
+                aria-describedby="root_0__error root_0__description root_0__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_0"
+                label=""
+                name="root[0]"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                type="text"
+                value="text"
+              />
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-12"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-number"
+            >
+              <input
+                aria-describedby="root_1__error root_1__description root_1__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_1"
+                label=""
+                name="root[1]"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                step="any"
+                type="number"
+                value={42}
+              />
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-12"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="checkbox "
+              >
+                <label>
+                  <input
+                    aria-describedby="root_2__error root_2__description root_2__help"
+                    autoFocus={false}
+                    checked={true}
+                    disabled={false}
+                    id="root_2"
+                    name="root[2]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    required={false}
+                    type="checkbox"
+                  />
+                  <span />
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-of-array"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                id="root_0"
+              >
+                <div
+                  className="row array-item-list"
+                >
+                  <div
+                    className="rjsf-array-item"
+                  >
+                    <div
+                      className="col-xs-9"
+                    >
+                      <div
+                        className="form-group rjsf-field rjsf-field-string"
+                      >
+                        <input
+                          aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_0_0"
+                          label=""
+                          name="root[0][0]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="a"
+                        />
+                      </div>
+                    </div>
+                    <div
+                      className="col-xs-3 array-item-toolbox"
+                    >
+                      <div
+                        className="btn-group"
+                        style={
+                          {
+                            "display": "flex",
+                            "justifyContent": "space-around",
+                          }
+                        }
+                      >
+                        <button
+                          className="btn btn-default rjsf-array-item-move-up"
+                          disabled={true}
+                          id="root_0_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_0_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_0_0__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                          type="button"
+                        >
+                          <i
+                            className="glyphicon glyphicon-remove"
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-array-item"
+                  >
+                    <div
+                      className="col-xs-9"
+                    >
+                      <div
+                        className="form-group rjsf-field rjsf-field-string"
+                      >
+                        <input
+                          aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_0_1"
+                          label=""
+                          name="root[0][1]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="b"
+                        />
+                      </div>
+                    </div>
+                    <div
+                      className="col-xs-3 array-item-toolbox"
+                    >
+                      <div
+                        className="btn-group"
+                        style={
+                          {
+                            "display": "flex",
+                            "justifyContent": "space-around",
+                          }
+                        }
+                      >
+                        <button
+                          className="btn btn-default rjsf-array-item-move-up"
+                          disabled={false}
+                          id="root_0_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_0_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_0_1__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                          type="button"
+                        >
+                          <i
+                            className="glyphicon glyphicon-remove"
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="row"
+                >
+                  <p
+                    className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+                  >
+                    <button
+                      className="btn btn-info btn-add col-xs-12"
+                      disabled={false}
+                      id="root_0__add"
+                      onClick={[Function]}
+                      title="Add"
+                      type="button"
+                    >
+                      <i
+                        className="glyphicon glyphicon-plus"
+                      />
+                    </button>
+                  </p>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={true}
+                id="root_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_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_0__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-array"
+            >
+              <fieldset
+                className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                id="root_1"
+              >
+                <div
+                  className="row array-item-list"
+                >
+                  <div
+                    className="rjsf-array-item"
+                  >
+                    <div
+                      className="col-xs-9"
+                    >
+                      <div
+                        className="form-group rjsf-field rjsf-field-string"
+                      >
+                        <input
+                          aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_1_0"
+                          label=""
+                          name="root[1][0]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="c"
+                        />
+                      </div>
+                    </div>
+                    <div
+                      className="col-xs-3 array-item-toolbox"
+                    >
+                      <div
+                        className="btn-group"
+                        style={
+                          {
+                            "display": "flex",
+                            "justifyContent": "space-around",
+                          }
+                        }
+                      >
+                        <button
+                          className="btn btn-default rjsf-array-item-move-up"
+                          disabled={true}
+                          id="root_1_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_1_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_1_0__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                          type="button"
+                        >
+                          <i
+                            className="glyphicon glyphicon-remove"
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-array-item"
+                  >
+                    <div
+                      className="col-xs-9"
+                    >
+                      <div
+                        className="form-group rjsf-field rjsf-field-string"
+                      >
+                        <input
+                          aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_1_1"
+                          label=""
+                          name="root[1][1]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="d"
+                        />
+                      </div>
+                    </div>
+                    <div
+                      className="col-xs-3 array-item-toolbox"
+                    >
+                      <div
+                        className="btn-group"
+                        style={
+                          {
+                            "display": "flex",
+                            "justifyContent": "space-around",
+                          }
+                        }
+                      >
+                        <button
+                          className="btn btn-default rjsf-array-item-move-up"
+                          disabled={false}
+                          id="root_1_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_1_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_1_1__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                          type="button"
+                        >
+                          <i
+                            className="glyphicon glyphicon-remove"
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="row"
+                >
+                  <p
+                    className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+                  >
+                    <button
+                      className="btn btn-info btn-add col-xs-12"
+                      disabled={false}
+                      id="root_1__add"
+                      onClick={[Function]}
+                      title="Add"
+                      type="button"
+                    >
+                      <i
+                        className="glyphicon glyphicon-plus"
+                      />
+                    </button>
+                  </p>
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={false}
+                id="root_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_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_1__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <p
+          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+        >
+          <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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_0"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_0_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_0_name"
+                    label="name"
+                    name="root.0.name"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    type="text"
+                    value="Item 1"
+                  />
+                </div>
+                <div
+                  className="form-group rjsf-field rjsf-field-number"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_0_value"
+                  >
+                    value
+                  </label>
+                  <input
+                    aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_0_value"
+                    label="value"
+                    name="root.0.value"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    step="any"
+                    type="number"
+                    value={10}
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={true}
+                id="root_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_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_0__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-object"
+            >
+              <fieldset
+                id="root_1"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_1_name"
+                  >
+                    name
+                  </label>
+                  <input
+                    aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_1_name"
+                    label="name"
+                    name="root.1.name"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    type="text"
+                    value="Item 2"
+                  />
+                </div>
+                <div
+                  className="form-group rjsf-field rjsf-field-number"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_1_value"
+                  >
+                    value
+                  </label>
+                  <input
+                    aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_1_value"
+                    label="value"
+                    name="root.1.value"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    step="any"
+                    type="number"
+                    value={20}
+                  />
+                </div>
+              </fieldset>
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={false}
+                id="root_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_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_1__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <p
+          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+        >
+          <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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-array"
+  >
+    <fieldset
+      className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+      id="root"
+    >
+      <div
+        className="row array-item-list"
+      >
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-string"
+            >
+              <input
+                aria-describedby="root_0__error root_0__description root_0__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_0"
+                label=""
+                name="root.0"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                type="text"
+                value="foo"
+              />
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={true}
+                id="root_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_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_0__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+        <div
+          className="rjsf-array-item"
+        >
+          <div
+            className="col-xs-9"
+          >
+            <div
+              className="form-group rjsf-field rjsf-field-string"
+            >
+              <input
+                aria-describedby="root_1__error root_1__description root_1__help"
+                autoFocus={false}
+                className="form-control"
+                disabled={false}
+                id="root_1"
+                label=""
+                name="root.1"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder=""
+                readOnly={false}
+                required={true}
+                type="text"
+                value="bar"
+              />
+            </div>
+          </div>
+          <div
+            className="col-xs-3 array-item-toolbox"
+          >
+            <div
+              className="btn-group"
+              style={
+                {
+                  "display": "flex",
+                  "justifyContent": "space-around",
+                }
+              }
+            >
+              <button
+                className="btn btn-default rjsf-array-item-move-up"
+                disabled={false}
+                id="root_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_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_1__remove"
+                onClick={[Function]}
+                title="Remove"
+                type="button"
+              >
+                <i
+                  className="glyphicon glyphicon-remove"
+                />
+              </button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <p
+          className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+        >
+          <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>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/core/test/__snapshots__/FormSnap.test.tsx.snap b/packages/core/test/__snapshots__/FormSnap.test.tsx.snap
index 7c7630df14..c2239216db 100644
--- a/packages/core/test/__snapshots__/FormSnap.test.tsx.snap
+++ b/packages/core/test/__snapshots__/FormSnap.test.tsx.snap
@@ -1,5 +1,2067 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-array"
+      >
+        <fieldset
+          className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+          id="root_tasks"
+        >
+          <legend
+            id="root_tasks__title"
+          >
+            tasks
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-object"
+                >
+                  <fieldset
+                    id="root_tasks_0"
+                  >
+                    <legend
+                      id="root_tasks_0__title"
+                    >
+                      tasks-1
+                      <span
+                        className="required"
+                      >
+                        *
+                      </span>
+                    </legend>
+                    <div
+                      className="form-group rjsf-field rjsf-field-string"
+                    >
+                      <label
+                        className="control-label"
+                        htmlFor="root_tasks_0_title"
+                      >
+                        title
+                      </label>
+                      <input
+                        aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                        autoFocus={false}
+                        className="form-control"
+                        disabled={false}
+                        id="root_tasks_0_title"
+                        label="title"
+                        name="root[tasks][0][title]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        placeholder=""
+                        readOnly={false}
+                        required={false}
+                        type="text"
+                        value="Task 1"
+                      />
+                    </div>
+                    <div
+                      className="form-group rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="checkbox "
+                      >
+                        <label>
+                          <input
+                            aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                            autoFocus={false}
+                            checked={false}
+                            disabled={false}
+                            id="root_tasks_0_done"
+                            name="root[tasks][0][done]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            required={false}
+                            type="checkbox"
+                          />
+                          <span>
+                            done
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <button
+                    className="btn btn-default rjsf-array-item-move-up"
+                    disabled={true}
+                    id="root_tasks_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_tasks_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_tasks_0__remove"
+                    onClick={[Function]}
+                    title="Remove"
+                    type="button"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-object"
+                >
+                  <fieldset
+                    id="root_tasks_1"
+                  >
+                    <legend
+                      id="root_tasks_1__title"
+                    >
+                      tasks-2
+                      <span
+                        className="required"
+                      >
+                        *
+                      </span>
+                    </legend>
+                    <div
+                      className="form-group rjsf-field rjsf-field-string"
+                    >
+                      <label
+                        className="control-label"
+                        htmlFor="root_tasks_1_title"
+                      >
+                        title
+                      </label>
+                      <input
+                        aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                        autoFocus={false}
+                        className="form-control"
+                        disabled={false}
+                        id="root_tasks_1_title"
+                        label="title"
+                        name="root[tasks][1][title]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        placeholder=""
+                        readOnly={false}
+                        required={false}
+                        type="text"
+                        value="Task 2"
+                      />
+                    </div>
+                    <div
+                      className="form-group rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="checkbox "
+                      >
+                        <label>
+                          <input
+                            aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                            autoFocus={false}
+                            checked={true}
+                            disabled={false}
+                            id="root_tasks_1_done"
+                            name="root[tasks][1][done]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            required={false}
+                            type="checkbox"
+                          />
+                          <span>
+                            done
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <button
+                    className="btn btn-default rjsf-array-item-move-up"
+                    disabled={false}
+                    id="root_tasks_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_tasks_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_tasks_1__remove"
+                    onClick={[Function]}
+                    title="Remove"
+                    type="button"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_tasks__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-array"
+      >
+        <fieldset
+          className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+          id="root_tags"
+        >
+          <legend
+            id="root_tags__title"
+          >
+            tags
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_0"
+                  >
+                    tags-1
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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="foo"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <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>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_1"
+                  >
+                    tags-2
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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="bar"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_tags__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-array"
+      >
+        <label
+          className="control-label"
+          htmlFor="root_choices"
+        >
+          choices
+        </label>
+        <div
+          className="checkboxes"
+          id="root_choices"
+        >
+          <div
+            className="checkbox "
+          >
+            <label>
+              <span>
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  disabled={false}
+                  id="root_choices-0"
+                  name="root[choices][]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  type="checkbox"
+                  value="0"
+                />
+                <span>
+                  foo
+                </span>
+              </span>
+            </label>
+          </div>
+          <div
+            className="checkbox "
+          >
+            <label>
+              <span>
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  disabled={false}
+                  id="root_choices-1"
+                  name="root[choices][]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  type="checkbox"
+                  value="1"
+                />
+                <span>
+                  bar
+                </span>
+              </span>
+            </label>
+          </div>
+          <div
+            className="checkbox "
+          >
+            <label>
+              <span>
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  disabled={false}
+                  id="root_choices-2"
+                  name="root[choices][]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  type="checkbox"
+                  value="2"
+                />
+                <span>
+                  baz
+                </span>
+              </span>
+            </label>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-object"
+      >
+        <fieldset
+          id="root_person"
+        >
+          <legend
+            id="root_person__title"
+          >
+            person
+          </legend>
+          <div
+            className="form-group rjsf-field rjsf-field-string"
+          >
+            <label
+              className="control-label"
+              htmlFor="root_person_firstName"
+            >
+              firstName
+            </label>
+            <input
+              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+              autoFocus={false}
+              className="form-control"
+              disabled={false}
+              id="root_person_firstName"
+              label="firstName"
+              name="root[person][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_person_lastName"
+            >
+              lastName
+            </label>
+            <input
+              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+              autoFocus={false}
+              className="form-control"
+              disabled={false}
+              id="root_person_lastName"
+              label="lastName"
+              name="root[person][lastName]"
+              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"
+            >
+              <legend
+                id="root_person_address__title"
+              >
+                address
+              </legend>
+              <div
+                className="form-group rjsf-field rjsf-field-string"
+              >
+                <label
+                  className="control-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"
+                  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"
+                >
+                  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>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-label"
+          htmlFor="root_option"
+        >
+          option
+        </label>
+        <div
+          className="field-radio-group"
+          id="root_option"
+          role="radiogroup"
+        >
+          <div
+            className="radio "
+          >
+            <label>
+              <span>
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  autoFocus={false}
+                  checked={false}
+                  disabled={false}
+                  id="root_option-0"
+                  name="root[option]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  type="radio"
+                  value="0"
+                />
+                <span>
+                  foo
+                </span>
+              </span>
+            </label>
+          </div>
+          <div
+            className="radio "
+          >
+            <label>
+              <span>
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  autoFocus={false}
+                  checked={false}
+                  disabled={false}
+                  id="root_option-1"
+                  name="root[option]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  type="radio"
+                  value="1"
+                />
+                <span>
+                  bar
+                </span>
+              </span>
+            </label>
+          </div>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-label"
+          htmlFor="root_color"
+        >
+          color
+        </label>
+        <select
+          aria-describedby="root_color__error root_color__description root_color__help"
+          autoFocus={false}
+          className="form-control"
+          disabled={false}
+          id="root_color"
+          multiple={false}
+          name="root[color]"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          required={false}
+          role="combobox"
+          value=""
+        >
+          <option
+            value=""
+          />
+          <option
+            value="0"
+          >
+            red
+          </option>
+          <option
+            value="1"
+          >
+            green
+          </option>
+          <option
+            value="2"
+          >
+            blue
+          </option>
+        </select>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-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"
+          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-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=""
+        />
+      </div>
+      <div
+        className="form-group rjsf-field rjsf-field-boolean"
+      >
+        <div
+          className="checkbox "
+        >
+          <label>
+            <input
+              aria-describedby="root_active__error root_active__description root_active__help"
+              autoFocus={false}
+              checked={false}
+              disabled={false}
+              id="root_active"
+              name="root[active]"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onFocus={[Function]}
+              required={false}
+              type="checkbox"
+            />
+            <span>
+              active
+            </span>
+          </label>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-label"
+          htmlFor="root_description"
+        >
+          description
+        </label>
+        <textarea
+          aria-describedby="root_description__error root_description__description root_description__help"
+          autoFocus={false}
+          className="form-control"
+          disabled={false}
+          id="root_description"
+          name="root[description]"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          placeholder=""
+          readOnly={false}
+          required={false}
+          value=""
+        />
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-array"
+      >
+        <fieldset
+          className="rjsf-field rjsf-field-array rjsf-field-array-of-object"
+          id="root_tasks"
+        >
+          <legend
+            id="root_tasks__title"
+          >
+            tasks
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-object"
+                >
+                  <fieldset
+                    id="root_tasks_0"
+                  >
+                    <legend
+                      id="root_tasks_0__title"
+                    >
+                      tasks-1
+                      <span
+                        className="required"
+                      >
+                        *
+                      </span>
+                    </legend>
+                    <div
+                      className="form-group rjsf-field rjsf-field-string"
+                    >
+                      <label
+                        className="control-label"
+                        htmlFor="root_tasks_0_title"
+                      >
+                        title
+                      </label>
+                      <input
+                        aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                        autoFocus={false}
+                        className="form-control"
+                        disabled={false}
+                        id="root_tasks_0_title"
+                        label="title"
+                        name="root.tasks.0.title"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        placeholder=""
+                        readOnly={false}
+                        required={false}
+                        type="text"
+                        value="Task 1"
+                      />
+                    </div>
+                    <div
+                      className="form-group rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="checkbox "
+                      >
+                        <label>
+                          <input
+                            aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                            autoFocus={false}
+                            checked={false}
+                            disabled={false}
+                            id="root_tasks_0_done"
+                            name="root.tasks.0.done"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            required={false}
+                            type="checkbox"
+                          />
+                          <span>
+                            done
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <button
+                    className="btn btn-default rjsf-array-item-move-up"
+                    disabled={true}
+                    id="root_tasks_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_tasks_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_tasks_0__remove"
+                    onClick={[Function]}
+                    title="Remove"
+                    type="button"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-object"
+                >
+                  <fieldset
+                    id="root_tasks_1"
+                  >
+                    <legend
+                      id="root_tasks_1__title"
+                    >
+                      tasks-2
+                      <span
+                        className="required"
+                      >
+                        *
+                      </span>
+                    </legend>
+                    <div
+                      className="form-group rjsf-field rjsf-field-string"
+                    >
+                      <label
+                        className="control-label"
+                        htmlFor="root_tasks_1_title"
+                      >
+                        title
+                      </label>
+                      <input
+                        aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                        autoFocus={false}
+                        className="form-control"
+                        disabled={false}
+                        id="root_tasks_1_title"
+                        label="title"
+                        name="root.tasks.1.title"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        placeholder=""
+                        readOnly={false}
+                        required={false}
+                        type="text"
+                        value="Task 2"
+                      />
+                    </div>
+                    <div
+                      className="form-group rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="checkbox "
+                      >
+                        <label>
+                          <input
+                            aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                            autoFocus={false}
+                            checked={true}
+                            disabled={false}
+                            id="root_tasks_1_done"
+                            name="root.tasks.1.done"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            required={false}
+                            type="checkbox"
+                          />
+                          <span>
+                            done
+                          </span>
+                        </label>
+                      </div>
+                    </div>
+                  </fieldset>
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <button
+                    className="btn btn-default rjsf-array-item-move-up"
+                    disabled={false}
+                    id="root_tasks_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_tasks_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_tasks_1__remove"
+                    onClick={[Function]}
+                    title="Remove"
+                    type="button"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_tasks__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-array"
+      >
+        <fieldset
+          className="rjsf-field rjsf-field-array rjsf-field-array-of-string"
+          id="root_tags"
+        >
+          <legend
+            id="root_tags__title"
+          >
+            tags
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_0"
+                  >
+                    tags-1
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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="foo"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <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>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_1"
+                  >
+                    tags-2
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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="bar"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_tags__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-object"
+      >
+        <fieldset
+          id="root_person"
+        >
+          <legend
+            id="root_person__title"
+          >
+            person
+          </legend>
+          <div
+            className="form-group rjsf-field rjsf-field-string"
+          >
+            <label
+              className="control-label"
+              htmlFor="root_person_firstName"
+            >
+              firstName
+            </label>
+            <input
+              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+              autoFocus={false}
+              className="form-control"
+              disabled={false}
+              id="root_person_firstName"
+              label="firstName"
+              name="root.person.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_person_lastName"
+            >
+              lastName
+            </label>
+            <input
+              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+              autoFocus={false}
+              className="form-control"
+              disabled={false}
+              id="root_person_lastName"
+              label="lastName"
+              name="root.person.lastName"
+              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"
+            >
+              <legend
+                id="root_person_address__title"
+              >
+                address
+              </legend>
+              <div
+                className="form-group rjsf-field rjsf-field-string"
+              >
+                <label
+                  className="control-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"
+                  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"
+                >
+                  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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-label"
+          htmlFor="root_color"
+        >
+          color
+        </label>
+        <select
+          aria-describedby="root_color__error root_color__description root_color__help"
+          autoFocus={false}
+          className="form-control"
+          disabled={false}
+          id="root_color"
+          multiple={false}
+          name="root.color"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onFocus={[Function]}
+          required={false}
+          role="combobox"
+          value=""
+        >
+          <option
+            value=""
+          />
+          <option
+            value="0"
+          >
+            red
+          </option>
+          <option
+            value="1"
+          >
+            green
+          </option>
+          <option
+            value="2"
+          >
+            blue
+          </option>
+        </select>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-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"
+          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-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=""
+        />
+      </div>
+      <div
+        className="form-group rjsf-field rjsf-field-boolean"
+      >
+        <div
+          className="checkbox "
+        >
+          <label>
+            <input
+              aria-describedby="root_active__error root_active__description root_active__help"
+              autoFocus={false}
+              checked={false}
+              disabled={false}
+              id="root_active"
+              name="root.active"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onFocus={[Function]}
+              required={false}
+              type="checkbox"
+            />
+            <span>
+              active
+            </span>
+          </label>
+        </div>
+      </div>
+    </fieldset>
+  </div>
+  <div>
+    <button
+      className="btn btn-info "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap b/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
index 487f7d8a2e..286786a118 100644
--- a/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
+++ b/packages/core/test/__snapshots__/ObjectSnap.test.tsx.snap
@@ -1,5 +1,1288 @@
 // 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"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-object"
+      >
+        <fieldset
+          id="root_person"
+        >
+          <legend
+            id="root_person__title"
+          >
+            person
+          </legend>
+          <div
+            className="form-group rjsf-field rjsf-field-string"
+          >
+            <label
+              className="control-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"
+              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"
+            >
+              <legend
+                id="root_person_address__title"
+              >
+                address
+              </legend>
+              <div
+                className="form-group rjsf-field rjsf-field-string"
+              >
+                <label
+                  className="control-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"
+                  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"
+                >
+                  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"
+                >
+                  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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <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="John"
+        />
+      </div>
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <div
+          className="row"
+        >
+          <div
+            className="col-xs-5 form-additional"
+          >
+            <div
+              className="form-group"
+            >
+              <label
+                className="control-label"
+                htmlFor="root_customField-key"
+              >
+                customField Key
+              </label>
+              <input
+                className="form-control"
+                defaultValue="customField"
+                id="root_customField-key"
+                onBlur={[Function]}
+                type="text"
+              />
+            </div>
+          </div>
+          <div
+            className="form-additional form-group col-xs-5"
+          >
+            <label
+              className="control-label"
+              htmlFor="root_customField"
+            >
+              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"
+            />
+          </div>
+          <div
+            className="col-xs-2"
+          >
+            <button
+              className="btn btn-danger rjsf-object-property-remove btn-block"
+              disabled={false}
+              id="root_customField__remove"
+              onClick={[Function]}
+              style={
+                {
+                  "border": "0",
+                }
+              }
+              title="Remove"
+              type="button"
+            >
+              <i
+                className="glyphicon glyphicon-remove"
+              />
+            </button>
+          </div>
+        </div>
+      </div>
+      <div
+        className="row"
+      >
+        <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <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"
+      >
+        <div
+          className="checkbox "
+        >
+          <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>
+        </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"
+        >
+          <legend
+            id="root_tags__title"
+          >
+            tags
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_0"
+                  >
+                    tags-1
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <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>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_tags_1"
+                  >
+                    tags-2
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_tags__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-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"
+          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"
+        >
+          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"
+        >
+          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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-object"
+      >
+        <fieldset
+          id="root_person"
+        >
+          <legend
+            id="root_person__title"
+          >
+            person
+          </legend>
+          <div
+            className="form-group rjsf-field rjsf-field-string"
+          >
+            <label
+              className="control-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"
+              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"
+            >
+              <legend
+                id="root_person_address__title"
+              >
+                address
+              </legend>
+              <div
+                className="form-group rjsf-field rjsf-field-string"
+              >
+                <label
+                  className="control-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"
+                  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"
+                >
+                  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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <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"
+      >
+        <label
+          className="control-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"
+          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"
+        >
+          <legend
+            id="root_items__title"
+          >
+            items
+          </legend>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_items_0"
+                  >
+                    items-1
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <i
+                      className="glyphicon glyphicon-remove"
+                    />
+                  </button>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="col-xs-9"
+              >
+                <div
+                  className="form-group rjsf-field rjsf-field-string"
+                >
+                  <label
+                    className="control-label"
+                    htmlFor="root_items_1"
+                  >
+                    items-2
+                    <span
+                      className="required"
+                    >
+                      *
+                    </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"
+                  />
+                </div>
+              </div>
+              <div
+                className="col-xs-3 array-item-toolbox"
+              >
+                <div
+                  className="btn-group"
+                  style={
+                    {
+                      "display": "flex",
+                      "justifyContent": "space-around",
+                    }
+                  }
+                >
+                  <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"
+                  >
+                    <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>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="row"
+          >
+            <p
+              className="col-xs-3 col-xs-offset-9 text-right rjsf-array-item-add"
+            >
+              <button
+                className="btn btn-info btn-add col-xs-12"
+                disabled={false}
+                id="root_items__add"
+                onClick={[Function]}
+                title="Add"
+                type="button"
+              >
+                <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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="form-group rjsf-field rjsf-field-object"
+  >
+    <fieldset
+      id="root"
+    >
+      <div
+        className="form-group rjsf-field rjsf-field-string"
+      >
+        <label
+          className="control-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"
+          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"
+        >
+          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"
+        >
+          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>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/daisyui/test/__snapshots__/Array.test.tsx.snap b/packages/daisyui/test/__snapshots__/Array.test.tsx.snap
index bc1789eeee..74e1c12da3 100644
--- a/packages/daisyui/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/daisyui/test/__snapshots__/Array.test.tsx.snap
@@ -1216,6 +1216,3289 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-object"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-object"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-object"
+                  disabled={false}
+                >
+                  <div
+                    className="form-control "
+                  >
+                    <div
+                      className="grid grid-cols-1 gap-4 mb-4"
+                    >
+                      <div
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_0_name"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                name
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_0_name"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_0_name"
+                                name="root[0][name]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 1"
+                              />
+                            </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
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-number"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-number"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_0_value"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                value
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_0_value"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  value
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_0_value"
+                                name="root[0][value]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={10}
+                              />
+                            </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="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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={true}
+                    id="root_0__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={false}
+                    id="root_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"
+                    >
+                      <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_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"
+                    >
+                      <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>
+            </fieldset>
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
+            >
+              <div
+                className="rjsf-field rjsf-field-object"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-object"
+                  disabled={false}
+                >
+                  <div
+                    className="form-control "
+                  >
+                    <div
+                      className="grid grid-cols-1 gap-4 mb-4"
+                    >
+                      <div
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_1_name"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                name
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_1_name"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_1_name"
+                                name="root[1][name]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 2"
+                              />
+                            </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
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-number"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-number"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_1_value"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                value
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_1_value"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  value
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_1_value"
+                                name="root[1][value]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={20}
+                              />
+                            </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="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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={false}
+                    id="root_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_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_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"
+                      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>
+            </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__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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-string"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_0"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_0"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_0__error root_0__description root_0__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_0"
+                      name="root[0]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      type="text"
+                      value="foo"
+                    />
+                  </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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={true}
+                    id="root_0__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={false}
+                    id="root_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"
+                    >
+                      <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_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"
+                    >
+                      <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>
+            </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"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-string"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_1"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_1"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_1__error root_1__description root_1__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_1"
+                      name="root[1]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      type="text"
+                      value="bar"
+                    />
+                  </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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={false}
+                    id="root_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_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_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"
+                      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>
+            </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__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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <label
+        className="label"
+        htmlFor="root"
+      >
+        <span
+          className="label-text font-medium"
+        />
+      </label>
+      <div
+        className="form-control w-full"
+      >
+        <div
+          className="dropdown w-full"
+        >
+          <div
+            className="btn btn-outline w-full text-left flex justify-between items-center "
+            onBlur={[Function]}
+            onFocus={[Function]}
+            role="button"
+            tabIndex={0}
+          >
+            <span
+              className="truncate"
+            >
+              Select...
+            </span>
+            <span
+              className="ml-2"
+            >
+              ▼
+            </span>
+          </div>
+          <ul
+            className="dropdown-content z-[1] bg-base-100 w-full max-h-60 overflow-auto rounded-box shadow-lg"
+          >
+            <li
+              className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+              data-value={0}
+              onClick={[Function]}
+              role="button"
+              tabIndex={0}
+            >
+              <div
+                className="flex items-center gap-2"
+              >
+                <input
+                  checked={false}
+                  className="checkbox checkbox-sm"
+                  readOnly={true}
+                  type="checkbox"
+                />
+                <span>
+                  foo
+                </span>
+              </div>
+            </li>
+            <li
+              className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+              data-value={1}
+              onClick={[Function]}
+              role="button"
+              tabIndex={0}
+            >
+              <div
+                className="flex items-center gap-2"
+              >
+                <input
+                  checked={false}
+                  className="checkbox checkbox-sm"
+                  readOnly={true}
+                  type="checkbox"
+                />
+                <span>
+                  bar
+                </span>
+              </div>
+            </li>
+            <li
+              className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+              data-value={2}
+              onClick={[Function]}
+              role="button"
+              tabIndex={0}
+            >
+              <div
+                className="flex items-center gap-2"
+              >
+                <input
+                  checked={false}
+                  className="checkbox checkbox-sm"
+                  readOnly={true}
+                  type="checkbox"
+                />
+                <span>
+                  baz
+                </span>
+              </div>
+            </li>
+          </ul>
+        </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-fixed-items"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-string"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_0"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_0"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_0__error root_0__description root_0__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_0"
+                      name="root[0]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      type="text"
+                      value="text"
+                    />
+                  </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>
+            </fieldset>
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4  mb-[-1px] z-9"
+            >
+              <div
+                className="rjsf-field rjsf-field-number"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-number"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_1"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_1"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_1__error root_1__description root_1__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_1"
+                      name="root[1]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      step="any"
+                      type="number"
+                      value={42}
+                    />
+                  </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>
+            </fieldset>
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-8"
+            >
+              <div
+                className="rjsf-field rjsf-field-boolean"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                  disabled={false}
+                >
+                  <div
+                    className="form-control"
+                  >
+                    <input
+                      checked={true}
+                      className="checkbox"
+                      disabled={false}
+                      id="root_2"
+                      name="root[2]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={true}
+                      type="checkbox"
+                    />
+                  </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>
+            </fieldset>
+          </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-array"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-array"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-array"
+                  disabled={false}
+                >
+                  <div
+                    className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                  >
+                    <div
+                      className="flex flex-col gap-4"
+                    >
+                      <div
+                        className="rjsf-array-item-list"
+                      >
+                        <fieldset
+                          className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="field-template mb-3 rjsf-field rjsf-field-string"
+                              disabled={false}
+                            >
+                              <label
+                                className="label"
+                                htmlFor="root_0_0"
+                              >
+                                <span
+                                  className="label-text font-medium"
+                                >
+                                  <span
+                                    className="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
+                                </span>
+                              </label>
+                              <div
+                                className="form-control"
+                              >
+                                <label
+                                  className="label hidden"
+                                  htmlFor="root_0_0"
+                                  style={
+                                    {
+                                      "display": "none",
+                                    }
+                                  }
+                                >
+                                  <span
+                                    className="label-text"
+                                  />
+                                </label>
+                                <input
+                                  aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                  autoFocus={false}
+                                  className="input input-bordered"
+                                  disabled={false}
+                                  id="root_0_0"
+                                  name="root[0][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>
+                            </div>
+                          </div>
+                          <div
+                            className="flex justify-end mt-2"
+                          >
+                            <div
+                              className="join"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled={true}
+                                id="root_0_0__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={false}
+                                id="root_0_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"
+                                >
+                                  <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_0_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"
+                                >
+                                  <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>
+                        </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"
+                          >
+                            <div
+                              className="field-template mb-3 rjsf-field rjsf-field-string"
+                              disabled={false}
+                            >
+                              <label
+                                className="label"
+                                htmlFor="root_0_1"
+                              >
+                                <span
+                                  className="label-text font-medium"
+                                >
+                                  <span
+                                    className="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
+                                </span>
+                              </label>
+                              <div
+                                className="form-control"
+                              >
+                                <label
+                                  className="label hidden"
+                                  htmlFor="root_0_1"
+                                  style={
+                                    {
+                                      "display": "none",
+                                    }
+                                  }
+                                >
+                                  <span
+                                    className="label-text"
+                                  />
+                                </label>
+                                <input
+                                  aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                  autoFocus={false}
+                                  className="input input-bordered"
+                                  disabled={false}
+                                  id="root_0_1"
+                                  name="root[0][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>
+                              <div
+                                className="rjsf-field-help-template text-gray-500 text-sm"
+                              >
+                                <div />
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="flex justify-end mt-2"
+                          >
+                            <div
+                              className="join"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled={false}
+                                id="root_0_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_0_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_0_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"
+                                  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>
+                        </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_0__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>
+                </div>
+              </div>
+              <div
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={true}
+                    id="root_0__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={false}
+                    id="root_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"
+                    >
+                      <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_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"
+                    >
+                      <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>
+            </fieldset>
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
+            >
+              <div
+                className="rjsf-field rjsf-field-array"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-array"
+                  disabled={false}
+                >
+                  <div
+                    className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                  >
+                    <div
+                      className="flex flex-col gap-4"
+                    >
+                      <div
+                        className="rjsf-array-item-list"
+                      >
+                        <fieldset
+                          className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="field-template mb-3 rjsf-field rjsf-field-string"
+                              disabled={false}
+                            >
+                              <label
+                                className="label"
+                                htmlFor="root_1_0"
+                              >
+                                <span
+                                  className="label-text font-medium"
+                                >
+                                  <span
+                                    className="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
+                                </span>
+                              </label>
+                              <div
+                                className="form-control"
+                              >
+                                <label
+                                  className="label hidden"
+                                  htmlFor="root_1_0"
+                                  style={
+                                    {
+                                      "display": "none",
+                                    }
+                                  }
+                                >
+                                  <span
+                                    className="label-text"
+                                  />
+                                </label>
+                                <input
+                                  aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                  autoFocus={false}
+                                  className="input input-bordered"
+                                  disabled={false}
+                                  id="root_1_0"
+                                  name="root[1][0]"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onFocus={[Function]}
+                                  placeholder=""
+                                  required={true}
+                                  type="text"
+                                  value="c"
+                                />
+                              </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
+                            className="flex justify-end mt-2"
+                          >
+                            <div
+                              className="join"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled={true}
+                                id="root_1_0__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={false}
+                                id="root_1_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"
+                                >
+                                  <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_1_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"
+                                >
+                                  <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>
+                        </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"
+                          >
+                            <div
+                              className="field-template mb-3 rjsf-field rjsf-field-string"
+                              disabled={false}
+                            >
+                              <label
+                                className="label"
+                                htmlFor="root_1_1"
+                              >
+                                <span
+                                  className="label-text font-medium"
+                                >
+                                  <span
+                                    className="text-error ml-1"
+                                  >
+                                    *
+                                  </span>
+                                </span>
+                              </label>
+                              <div
+                                className="form-control"
+                              >
+                                <label
+                                  className="label hidden"
+                                  htmlFor="root_1_1"
+                                  style={
+                                    {
+                                      "display": "none",
+                                    }
+                                  }
+                                >
+                                  <span
+                                    className="label-text"
+                                  />
+                                </label>
+                                <input
+                                  aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                  autoFocus={false}
+                                  className="input input-bordered"
+                                  disabled={false}
+                                  id="root_1_1"
+                                  name="root[1][1]"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onFocus={[Function]}
+                                  placeholder=""
+                                  required={true}
+                                  type="text"
+                                  value="d"
+                                />
+                              </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
+                            className="flex justify-end mt-2"
+                          >
+                            <div
+                              className="join"
+                            >
+                              <button
+                                aria-label="Move up"
+                                className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                                disabled={false}
+                                id="root_1_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_1_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_1_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"
+                                  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>
+                        </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_1__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>
+                </div>
+              </div>
+              <div
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={false}
+                    id="root_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_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_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"
+                      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>
+            </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__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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-object"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-object"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-object"
+                  disabled={false}
+                >
+                  <div
+                    className="form-control "
+                  >
+                    <div
+                      className="grid grid-cols-1 gap-4 mb-4"
+                    >
+                      <div
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_0_name"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                name
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_0_name"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_0_name"
+                                name="root.0.name"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 1"
+                              />
+                            </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
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-number"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-number"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_0_value"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                value
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_0_value"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  value
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_0_value"
+                                name="root.0.value"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={10}
+                              />
+                            </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="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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={true}
+                    id="root_0__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={false}
+                    id="root_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"
+                    >
+                      <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_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"
+                    >
+                      <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>
+            </fieldset>
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
+            >
+              <div
+                className="rjsf-field rjsf-field-object"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-object"
+                  disabled={false}
+                >
+                  <div
+                    className="form-control "
+                  >
+                    <div
+                      className="grid grid-cols-1 gap-4 mb-4"
+                    >
+                      <div
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_1_name"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                name
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_1_name"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  name
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_1_name"
+                                name="root.1.name"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 2"
+                              />
+                            </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
+                        className=""
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-number"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-number"
+                            disabled={false}
+                          >
+                            <label
+                              className="label"
+                              htmlFor="root_1_value"
+                            >
+                              <span
+                                className="label-text font-medium"
+                              >
+                                value
+                              </span>
+                            </label>
+                            <div
+                              className="form-control"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_1_value"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  value
+                                </span>
+                              </label>
+                              <input
+                                aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                autoFocus={false}
+                                className="input input-bordered"
+                                disabled={false}
+                                id="root_1_value"
+                                name="root.1.value"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={20}
+                              />
+                            </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="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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={false}
+                    id="root_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_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_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"
+                      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>
+            </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__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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-array"
+      disabled={false}
+    >
+      <div
+        className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+      >
+        <div
+          className="flex flex-col gap-4"
+        >
+          <div
+            className="rjsf-array-item-list"
+          >
+            <fieldset
+              className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+            >
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-string"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_0"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_0"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_0__error root_0__description root_0__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_0"
+                      name="root.0"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      type="text"
+                      value="foo"
+                    />
+                  </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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={true}
+                    id="root_0__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={false}
+                    id="root_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"
+                    >
+                      <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_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"
+                    >
+                      <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>
+            </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"
+              >
+                <div
+                  className="field-template mb-3 rjsf-field rjsf-field-string"
+                  disabled={false}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_1"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      <span
+                        className="text-error ml-1"
+                      >
+                        *
+                      </span>
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_1"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      />
+                    </label>
+                    <input
+                      aria-describedby="root_1__error root_1__description root_1__help"
+                      autoFocus={false}
+                      className="input input-bordered"
+                      disabled={false}
+                      id="root_1"
+                      name="root.1"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      placeholder=""
+                      required={true}
+                      type="text"
+                      value="bar"
+                    />
+                  </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
+                className="flex justify-end mt-2"
+              >
+                <div
+                  className="join"
+                >
+                  <button
+                    aria-label="Move up"
+                    className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                    disabled={false}
+                    id="root_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_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_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"
+                      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>
+            </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__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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/daisyui/test/__snapshots__/Form.test.tsx.snap b/packages/daisyui/test/__snapshots__/Form.test.tsx.snap
index a913294b66..579a47fa33 100644
--- a/packages/daisyui/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/daisyui/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,4130 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className="mt-2"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_tasks__title"
+                  >
+                    <h2
+                      className="text-3xl font-bold text-primary mb-2"
+                    >
+                      tasks
+                    </h2>
+                    <div
+                      className="divider divider-primary my-0"
+                    />
+                  </div>
+                  <div
+                    className="flex flex-col gap-4"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-object"
+                            disabled={false}
+                          >
+                            <div
+                              className="form-control "
+                            >
+                              <div
+                                className="title-field mb-6"
+                                id="root_tasks_0__title"
+                              >
+                                <h2
+                                  className="text-3xl font-bold text-primary mb-2"
+                                >
+                                  tasks-1
+                                </h2>
+                                <div
+                                  className="divider divider-primary my-0"
+                                />
+                              </div>
+                              <div
+                                className="grid grid-cols-1 gap-4 mb-4"
+                              >
+                                <div
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-string"
+                                      disabled={false}
+                                    >
+                                      <label
+                                        className="label"
+                                        htmlFor="root_tasks_0_title"
+                                      >
+                                        <span
+                                          className="label-text font-medium"
+                                        >
+                                          title
+                                        </span>
+                                      </label>
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label hidden"
+                                          htmlFor="root_tasks_0_title"
+                                          style={
+                                            {
+                                              "display": "none",
+                                            }
+                                          }
+                                        >
+                                          <span
+                                            className="label-text"
+                                          >
+                                            title
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                          autoFocus={false}
+                                          className="input input-bordered"
+                                          disabled={false}
+                                          id="root_tasks_0_title"
+                                          name="root[tasks][0][title]"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onFocus={[Function]}
+                                          placeholder=""
+                                          required={false}
+                                          type="text"
+                                          value="Task 1"
+                                        />
+                                      </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
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-boolean"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label cursor-pointer justify-start"
+                                        >
+                                          <div
+                                            className="mr-2"
+                                          >
+                                            <input
+                                              checked={false}
+                                              className="checkbox"
+                                              disabled={false}
+                                              id="root_tasks_0_done"
+                                              name="root[tasks][0][done]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                          </div>
+                                          <span
+                                            className="label-text"
+                                          >
+                                            done
+                                          </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>
+                                    </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <button
+                              aria-label="Move up"
+                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                              disabled={true}
+                              id="root_tasks_0__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={false}
+                              id="root_tasks_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"
+                              >
+                                <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_tasks_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"
+                              >
+                                <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>
+                      </fieldset>
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-object"
+                            disabled={false}
+                          >
+                            <div
+                              className="form-control "
+                            >
+                              <div
+                                className="title-field mb-6"
+                                id="root_tasks_1__title"
+                              >
+                                <h2
+                                  className="text-3xl font-bold text-primary mb-2"
+                                >
+                                  tasks-2
+                                </h2>
+                                <div
+                                  className="divider divider-primary my-0"
+                                />
+                              </div>
+                              <div
+                                className="grid grid-cols-1 gap-4 mb-4"
+                              >
+                                <div
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-string"
+                                      disabled={false}
+                                    >
+                                      <label
+                                        className="label"
+                                        htmlFor="root_tasks_1_title"
+                                      >
+                                        <span
+                                          className="label-text font-medium"
+                                        >
+                                          title
+                                        </span>
+                                      </label>
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label hidden"
+                                          htmlFor="root_tasks_1_title"
+                                          style={
+                                            {
+                                              "display": "none",
+                                            }
+                                          }
+                                        >
+                                          <span
+                                            className="label-text"
+                                          >
+                                            title
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                          autoFocus={false}
+                                          className="input input-bordered"
+                                          disabled={false}
+                                          id="root_tasks_1_title"
+                                          name="root[tasks][1][title]"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onFocus={[Function]}
+                                          placeholder=""
+                                          required={false}
+                                          type="text"
+                                          value="Task 2"
+                                        />
+                                      </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
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-boolean"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label cursor-pointer justify-start"
+                                        >
+                                          <div
+                                            className="mr-2"
+                                          >
+                                            <input
+                                              checked={true}
+                                              className="checkbox"
+                                              disabled={false}
+                                              id="root_tasks_1_done"
+                                              name="root[tasks][1][done]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                          </div>
+                                          <span
+                                            className="label-text"
+                                          >
+                                            done
+                                          </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>
+                                    </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <button
+                              aria-label="Move up"
+                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                              disabled={false}
+                              id="root_tasks_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_tasks_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_tasks_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"
+                                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>
+                      </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_tasks__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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_tags__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_0"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-0
+                                </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="foo"
+                              />
+                            </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
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                            >
+                              <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={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"
+                              >
+                                <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"
+                              >
+                                <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>
+                      </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"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_1"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-1
+                                </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="bar"
+                              />
+                            </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
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                              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"
+                                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>
+                      </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_choices"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    choices
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <div
+                    className="flex flex-col gap-2 mt-1"
+                  >
+                    <label
+                      className="flex items-center cursor-pointer gap-2"
+                    >
+                      <input
+                        checked={false}
+                        className="checkbox"
+                        data-index={0}
+                        disabled={false}
+                        id="root_choices-foo"
+                        name="root[choices][]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        required={false}
+                        type="checkbox"
+                      />
+                      <span
+                        className="label-text"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <label
+                      className="flex items-center cursor-pointer gap-2"
+                    >
+                      <input
+                        checked={false}
+                        className="checkbox"
+                        data-index={1}
+                        disabled={false}
+                        id="root_choices-bar"
+                        name="root[choices][]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        required={false}
+                        type="checkbox"
+                      />
+                      <span
+                        className="label-text"
+                      >
+                        bar
+                      </span>
+                    </label>
+                    <label
+                      className="flex items-center cursor-pointer gap-2"
+                    >
+                      <input
+                        checked={false}
+                        className="checkbox"
+                        data-index={2}
+                        disabled={false}
+                        id="root_choices-baz"
+                        name="root[choices][]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        required={false}
+                        type="checkbox"
+                      />
+                      <span
+                        className="label-text"
+                      >
+                        baz
+                      </span>
+                    </label>
+                  </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-object"
+                disabled={false}
+              >
+                <div
+                  className="form-control "
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_person__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_firstName"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              firstName
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_firstName"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                firstName
+                              </span>
+                            </label>
+                            <input
+                              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                              autoFocus={false}
+                              className="input input-bordered"
+                              disabled={false}
+                              id="root_person_firstName"
+                              name="root[person][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
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_lastName"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              lastName
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_lastName"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                lastName
+                              </span>
+                            </label>
+                            <input
+                              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                              autoFocus={false}
+                              className="input input-bordered"
+                              disabled={false}
+                              id="root_person_lastName"
+                              name="root[person][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>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-object"
+                          disabled={false}
+                        >
+                          <div
+                            className="form-control "
+                          >
+                            <div
+                              className="title-field mb-6"
+                              id="root_person_address__title"
+                            >
+                              <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"
+                            >
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_street"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        street
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_street"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_city"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        city
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_city"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </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>
+                        </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_option"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    option
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <div
+                    className="flex flex-col gap-2 mt-1"
+                  >
+                    <label
+                      className="flex items-center cursor-pointer gap-2"
+                    >
+                      <input
+                        checked={false}
+                        className="radio"
+                        data-index={0}
+                        disabled={false}
+                        id="root_option-foo"
+                        name="root[option]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        required={false}
+                        type="radio"
+                        value="foo"
+                      />
+                      <span
+                        className="label-text"
+                      >
+                        foo
+                      </span>
+                    </label>
+                    <label
+                      className="flex items-center cursor-pointer gap-2"
+                    >
+                      <input
+                        checked={false}
+                        className="radio"
+                        data-index={1}
+                        disabled={false}
+                        id="root_option-bar"
+                        name="root[option]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        required={false}
+                        type="radio"
+                        value="bar"
+                      />
+                      <span
+                        className="label-text"
+                      >
+                        bar
+                      </span>
+                    </label>
+                  </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_color"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    color
+                  </span>
+                </label>
+                <div
+                  className="form-control w-full"
+                >
+                  <div
+                    className="dropdown w-full"
+                  >
+                    <div
+                      className="btn btn-outline w-full text-left flex justify-between items-center "
+                      onBlur={[Function]}
+                      onFocus={[Function]}
+                      role="button"
+                      tabIndex={0}
+                    >
+                      <span
+                        className="truncate"
+                      />
+                      <span
+                        className="ml-2"
+                      >
+                        ▼
+                      </span>
+                    </div>
+                    <ul
+                      className="dropdown-content z-[1] bg-base-100 w-full max-h-60 overflow-auto rounded-box shadow-lg"
+                    >
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={0}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            red
+                          </span>
+                        </div>
+                      </li>
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={1}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            green
+                          </span>
+                        </div>
+                      </li>
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={2}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            blue
+                          </span>
+                        </div>
+                      </li>
+                    </ul>
+                  </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_firstName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    firstName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_firstName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_age"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    age
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_age"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                disabled={false}
+              >
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label cursor-pointer justify-start"
+                  >
+                    <div
+                      className="mr-2"
+                    >
+                      <input
+                        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"
+                    >
+                      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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_description"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    description
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <textarea
+                    className="textarea textarea-bordered w-full"
+                    disabled={false}
+                    id="root_description"
+                    name="root[description]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    readOnly={false}
+                    required={false}
+                    rows={5}
+                    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="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>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className="mt-2"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-object"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_tasks__title"
+                  >
+                    <h2
+                      className="text-3xl font-bold text-primary mb-2"
+                    >
+                      tasks
+                    </h2>
+                    <div
+                      className="divider divider-primary my-0"
+                    />
+                  </div>
+                  <div
+                    className="flex flex-col gap-4"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-object"
+                            disabled={false}
+                          >
+                            <div
+                              className="form-control "
+                            >
+                              <div
+                                className="title-field mb-6"
+                                id="root_tasks_0__title"
+                              >
+                                <h2
+                                  className="text-3xl font-bold text-primary mb-2"
+                                >
+                                  tasks-1
+                                </h2>
+                                <div
+                                  className="divider divider-primary my-0"
+                                />
+                              </div>
+                              <div
+                                className="grid grid-cols-1 gap-4 mb-4"
+                              >
+                                <div
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-string"
+                                      disabled={false}
+                                    >
+                                      <label
+                                        className="label"
+                                        htmlFor="root_tasks_0_title"
+                                      >
+                                        <span
+                                          className="label-text font-medium"
+                                        >
+                                          title
+                                        </span>
+                                      </label>
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label hidden"
+                                          htmlFor="root_tasks_0_title"
+                                          style={
+                                            {
+                                              "display": "none",
+                                            }
+                                          }
+                                        >
+                                          <span
+                                            className="label-text"
+                                          >
+                                            title
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                          autoFocus={false}
+                                          className="input input-bordered"
+                                          disabled={false}
+                                          id="root_tasks_0_title"
+                                          name="root.tasks.0.title"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onFocus={[Function]}
+                                          placeholder=""
+                                          required={false}
+                                          type="text"
+                                          value="Task 1"
+                                        />
+                                      </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
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-boolean"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label cursor-pointer justify-start"
+                                        >
+                                          <div
+                                            className="mr-2"
+                                          >
+                                            <input
+                                              checked={false}
+                                              className="checkbox"
+                                              disabled={false}
+                                              id="root_tasks_0_done"
+                                              name="root.tasks.0.done"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                          </div>
+                                          <span
+                                            className="label-text"
+                                          >
+                                            done
+                                          </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>
+                                    </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <button
+                              aria-label="Move up"
+                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                              disabled={true}
+                              id="root_tasks_0__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={false}
+                              id="root_tasks_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"
+                              >
+                                <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_tasks_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"
+                              >
+                                <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>
+                      </fieldset>
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-b-lg  z-9"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-object"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-object"
+                            disabled={false}
+                          >
+                            <div
+                              className="form-control "
+                            >
+                              <div
+                                className="title-field mb-6"
+                                id="root_tasks_1__title"
+                              >
+                                <h2
+                                  className="text-3xl font-bold text-primary mb-2"
+                                >
+                                  tasks-2
+                                </h2>
+                                <div
+                                  className="divider divider-primary my-0"
+                                />
+                              </div>
+                              <div
+                                className="grid grid-cols-1 gap-4 mb-4"
+                              >
+                                <div
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-string"
+                                      disabled={false}
+                                    >
+                                      <label
+                                        className="label"
+                                        htmlFor="root_tasks_1_title"
+                                      >
+                                        <span
+                                          className="label-text font-medium"
+                                        >
+                                          title
+                                        </span>
+                                      </label>
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label hidden"
+                                          htmlFor="root_tasks_1_title"
+                                          style={
+                                            {
+                                              "display": "none",
+                                            }
+                                          }
+                                        >
+                                          <span
+                                            className="label-text"
+                                          >
+                                            title
+                                          </span>
+                                        </label>
+                                        <input
+                                          aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                          autoFocus={false}
+                                          className="input input-bordered"
+                                          disabled={false}
+                                          id="root_tasks_1_title"
+                                          name="root.tasks.1.title"
+                                          onBlur={[Function]}
+                                          onChange={[Function]}
+                                          onFocus={[Function]}
+                                          placeholder=""
+                                          required={false}
+                                          type="text"
+                                          value="Task 2"
+                                        />
+                                      </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
+                                  className=""
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-boolean"
+                                  >
+                                    <div
+                                      className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                                      disabled={false}
+                                    >
+                                      <div
+                                        className="form-control"
+                                      >
+                                        <label
+                                          className="label cursor-pointer justify-start"
+                                        >
+                                          <div
+                                            className="mr-2"
+                                          >
+                                            <input
+                                              checked={true}
+                                              className="checkbox"
+                                              disabled={false}
+                                              id="root_tasks_1_done"
+                                              name="root.tasks.1.done"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                          </div>
+                                          <span
+                                            className="label-text"
+                                          >
+                                            done
+                                          </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>
+                                    </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <button
+                              aria-label="Move up"
+                              className="rjsf-array-item-move-up join-item btn btn-sm px-2"
+                              disabled={false}
+                              id="root_tasks_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_tasks_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_tasks_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"
+                                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>
+                      </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_tasks__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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_tags__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_0"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-0
+                                </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="foo"
+                              />
+                            </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
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                            >
+                              <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={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"
+                              >
+                                <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"
+                              >
+                                <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>
+                      </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"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_1"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-1
+                                </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="bar"
+                              />
+                            </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
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                              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"
+                                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>
+                      </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-object"
+                disabled={false}
+              >
+                <div
+                  className="form-control "
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_person__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_firstName"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              firstName
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_firstName"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                firstName
+                              </span>
+                            </label>
+                            <input
+                              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                              autoFocus={false}
+                              className="input input-bordered"
+                              disabled={false}
+                              id="root_person_firstName"
+                              name="root.person.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
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_lastName"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              lastName
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_lastName"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                lastName
+                              </span>
+                            </label>
+                            <input
+                              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                              autoFocus={false}
+                              className="input input-bordered"
+                              disabled={false}
+                              id="root_person_lastName"
+                              name="root.person.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>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-object"
+                          disabled={false}
+                        >
+                          <div
+                            className="form-control "
+                          >
+                            <div
+                              className="title-field mb-6"
+                              id="root_person_address__title"
+                            >
+                              <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"
+                            >
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_street"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        street
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_street"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_city"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        city
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_city"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </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>
+                        </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_color"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    color
+                  </span>
+                </label>
+                <div
+                  className="form-control w-full"
+                >
+                  <div
+                    className="dropdown w-full"
+                  >
+                    <div
+                      className="btn btn-outline w-full text-left flex justify-between items-center "
+                      onBlur={[Function]}
+                      onFocus={[Function]}
+                      role="button"
+                      tabIndex={0}
+                    >
+                      <span
+                        className="truncate"
+                      />
+                      <span
+                        className="ml-2"
+                      >
+                        ▼
+                      </span>
+                    </div>
+                    <ul
+                      className="dropdown-content z-[1] bg-base-100 w-full max-h-60 overflow-auto rounded-box shadow-lg"
+                    >
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={0}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            red
+                          </span>
+                        </div>
+                      </li>
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={1}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            green
+                          </span>
+                        </div>
+                      </li>
+                      <li
+                        className="px-4 py-2 hover:bg-base-200 cursor-pointer "
+                        data-value={2}
+                        onClick={[Function]}
+                        role="button"
+                        tabIndex={0}
+                      >
+                        <div
+                          className="flex items-center gap-2"
+                        >
+                          <span>
+                            blue
+                          </span>
+                        </div>
+                      </li>
+                    </ul>
+                  </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_firstName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    firstName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_firstName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_age"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    age
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_age"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                disabled={false}
+              >
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label cursor-pointer justify-start"
+                  >
+                    <div
+                      className="mr-2"
+                    >
+                      <input
+                        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"
+                    >
+                      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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/daisyui/test/__snapshots__/Object.test.tsx.snap b/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
index 313875f906..c63d5f321c 100644
--- a/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/daisyui/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,2752 @@
 // 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"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-object"
+                disabled={false}
+              >
+                <div
+                  className="form-control "
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_person__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_name"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              name
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_name"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                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>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-object"
+                          disabled={false}
+                        >
+                          <div
+                            className="form-control "
+                          >
+                            <div
+                              className="title-field mb-6"
+                              id="root_person_address__title"
+                            >
+                              <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"
+                            >
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_street"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        street
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_street"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_city"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        city
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_city"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_country"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        country
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_country"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </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>
+                        </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_name"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    name
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_name"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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="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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="wrap-if-additional-template rjsf-field rjsf-field-string"
+            >
+              <div
+                className="flex items-baseline"
+                style={
+                  {
+                    "justifyContent": "space-between",
+                  }
+                }
+              >
+                <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}
+                >
+                  <label
+                    className="label"
+                    htmlFor="root_customField"
+                  >
+                    <span
+                      className="label-text font-medium"
+                    >
+                      customField
+                    </span>
+                  </label>
+                  <div
+                    className="form-control"
+                  >
+                    <label
+                      className="label hidden"
+                      htmlFor="root_customField"
+                      style={
+                        {
+                          "display": "none",
+                        }
+                      }
+                    >
+                      <span
+                        className="label-text"
+                      >
+                        customField
+                      </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}
+                      type="text"
+                      value="customValue"
+                    />
+                  </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
+                  className="flex self-center"
+                >
+                  <button
+                    aria-label="Remove"
+                    className="rjsf-object-property-remove"
+                    disabled={false}
+                    id="root_customField__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"
+                    >
+                      <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>
+          </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>
+      <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>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_name"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    name
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_name"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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="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>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_age"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    age
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_age"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-boolean"
+                disabled={false}
+              >
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label cursor-pointer justify-start"
+                  >
+                    <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"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_tags__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_0"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-0
+                                </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                            >
+                              <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={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"
+                              >
+                                <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"
+                              >
+                                <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>
+                      </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"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_tags_1"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  tags-1
+                                </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>
+                            <div
+                              className="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                              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"
+                                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>
+                      </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_firstName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    firstName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_firstName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_lastName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    lastName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_lastName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_age"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    age
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_age"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-object"
+                disabled={false}
+              >
+                <div
+                  className="form-control "
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_person__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-string"
+                          disabled={false}
+                        >
+                          <label
+                            className="label"
+                            htmlFor="root_person_name"
+                          >
+                            <span
+                              className="label-text font-medium"
+                            >
+                              name
+                            </span>
+                          </label>
+                          <div
+                            className="form-control"
+                          >
+                            <label
+                              className="label hidden"
+                              htmlFor="root_person_name"
+                              style={
+                                {
+                                  "display": "none",
+                                }
+                              }
+                            >
+                              <span
+                                className="label-text"
+                              >
+                                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>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className=""
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="field-template mb-3 rjsf-field rjsf-field-object"
+                          disabled={false}
+                        >
+                          <div
+                            className="form-control "
+                          >
+                            <div
+                              className="title-field mb-6"
+                              id="root_person_address__title"
+                            >
+                              <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"
+                            >
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_street"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        street
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_street"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className=""
+                              >
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <div
+                                    className="field-template mb-3 rjsf-field rjsf-field-string"
+                                    disabled={false}
+                                  >
+                                    <label
+                                      className="label"
+                                      htmlFor="root_person_address_city"
+                                    >
+                                      <span
+                                        className="label-text font-medium"
+                                      >
+                                        city
+                                      </span>
+                                    </label>
+                                    <div
+                                      className="form-control"
+                                    >
+                                      <label
+                                        className="label hidden"
+                                        htmlFor="root_person_address_city"
+                                        style={
+                                          {
+                                            "display": "none",
+                                          }
+                                        }
+                                      >
+                                        <span
+                                          className="label-text"
+                                        >
+                                          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>
+                                  </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>
+                        </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_name"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    name
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_name"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_count"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    count
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_count"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-array"
+                disabled={false}
+              >
+                <div
+                  className="array-field-template rjsf-field rjsf-field-array rjsf-field-array-of-string"
+                >
+                  <div
+                    className="title-field mb-6"
+                    id="root_items__title"
+                  >
+                    <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"
+                  >
+                    <div
+                      className="rjsf-array-item-list"
+                    >
+                      <fieldset
+                        className="fieldset bg-base-100 border border-base-300 p-4 rounded-t-lg mb-[-1px] z-10"
+                      >
+                        <div
+                          className="rjsf-field rjsf-field-string"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_items_0"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  items-0
+                                </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>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                            >
+                              <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={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"
+                              >
+                                <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"
+                              >
+                                <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>
+                      </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"
+                        >
+                          <div
+                            className="field-template mb-3 rjsf-field rjsf-field-string"
+                            disabled={false}
+                          >
+                            <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"
+                            >
+                              <label
+                                className="label hidden"
+                                htmlFor="root_items_1"
+                                style={
+                                  {
+                                    "display": "none",
+                                  }
+                                }
+                              >
+                                <span
+                                  className="label-text"
+                                >
+                                  items-1
+                                </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>
+                            <div
+                              className="rjsf-field-help-template text-gray-500 text-sm"
+                            >
+                              <div />
+                            </div>
+                          </div>
+                        </div>
+                        <div
+                          className="flex justify-end mt-2"
+                        >
+                          <div
+                            className="join"
+                          >
+                            <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"
+                              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"
+                              >
+                                <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>
+                      </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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      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
+      className="field-template mb-3 rjsf-field rjsf-field-object"
+      disabled={false}
+    >
+      <div
+        className="form-control bg-base-100 p-6 rounded-xl shadow-lg"
+      >
+        <div
+          className="grid grid-cols-1 gap-4 "
+        >
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_firstName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    firstName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_firstName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <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
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-string"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_lastName"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    lastName
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_lastName"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </div>
+            </div>
+          </div>
+          <div
+            className=""
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <div
+                className="field-template mb-3 rjsf-field rjsf-field-number"
+                disabled={false}
+              >
+                <label
+                  className="label"
+                  htmlFor="root_age"
+                >
+                  <span
+                    className="label-text font-medium"
+                  >
+                    age
+                  </span>
+                </label>
+                <div
+                  className="form-control"
+                >
+                  <label
+                    className="label hidden"
+                    htmlFor="root_age"
+                    style={
+                      {
+                        "display": "none",
+                      }
+                    }
+                  >
+                    <span
+                      className="label-text"
+                    >
+                      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>
+              </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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary btn-primary-content "
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/fluentui-rc/test/__snapshots__/Array.test.tsx.snap b/packages/fluentui-rc/test/__snapshots__/Array.test.tsx.snap
index b5bf28a058..922c4efd75 100644
--- a/packages/fluentui-rc/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/fluentui-rc/test/__snapshots__/Array.test.tsx.snap
@@ -914,6 +914,2738 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <div
+          className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+        >
+          <div
+            className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+          >
+            <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="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_0_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_0_name"
+                            name="root[0][name]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 1"
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <label
+                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          htmlFor="root_0_value"
+                        >
+                          value
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_0_value"
+                            name="root[0][value]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={10}
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                </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_0__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              disabled={false}
+              id="root_0__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_0__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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-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="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_1_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_1_name"
+                            name="root[1][name]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 2"
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <label
+                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          htmlFor="root_1_value"
+                        >
+                          value
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_1_value"
+                            name="root[1][value]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={20}
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                </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_1__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+        >
+          <button
+            className="fui-Button r1alrhcs rjsf-array-item-add ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <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_0"
+                >
+                  <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_0__error root_0__description root_0__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_0"
+                    name="root[0]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    type="text"
+                    value="foo"
+                  />
+                </span>
+              </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_0__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              disabled={false}
+              id="root_0__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_0__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_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_1__error root_1__description root_1__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_1"
+                    name="root[1]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    type="text"
+                    value="bar"
+                  />
+                </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_1__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+        >
+          <button
+            className="fui-Button r1alrhcs rjsf-array-item-add ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <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-r2o__control"
+          id="field-r2o__label"
+        />
+        <div
+          className="fui-Dropdown form-control ___y239tk0_6yts2b0 ft85np5 f1ewtqcl ftuwxu6 f1exfvgq f10pi13n fmrv4ls f14a1fxs f3e99gv fhljsf7 f1gw3sf2 f13zj6fq f1mdlcz9 f1a7op3 f1gboi2j f1cjjd47 ffyw7fx f1kp91vd f1ibwz09 f1mnjydx f13evtba f1yk9hq fhwpy7i f14ee0xe f1xhbsuh fv8e3ye ftb5wc6 fjw5xc1 f1xdyd5c fatpbeo fb7uyps f1cmft4k f1x58t8o f1ibeo51 f132nw8t f1htdosj fxugw4r f1c1zstj fhz96rm fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi fvs00aa f1assf6x f1z0osm6 f4ruux4 f1b473iu f381qr8 f1qzcrsd ft4skwv"
+        >
+          <button
+            aria-describedby="root__error root__description root__help"
+            aria-expanded={false}
+            aria-labelledby="field-r2o__label"
+            autoFocus={false}
+            className="fui-Dropdown__button ___12pyx89_1vewwra f122n59 f1c21dwh f3bhgqh f1ewtqcl f19n0e5 f14mj54c f1k6fduh f13qh94s fk6fouc f12nh0o2 f1869bpl f1o700av fly5x3f ftqa4ok fkhj508 figsok6 f1i3iumi f14ev680"
+            disabled={false}
+            id="root"
+            name="root"
+            onBlur={[Function]}
+            onClick={[Function]}
+            onFocus={[Function]}
+            onKeyDown={[Function]}
+            role="combobox"
+            tabIndex={0}
+            type="button"
+            value=""
+          >
+            <span
+              className="fui-Dropdown__expandIcon ___5y6ahy0_3cm10l0 f1ewtqcl fxkbij4 ftgm304 fe5j1ua f12w6cgp f8bv1bt fvc9v3g f1h9en5y"
+            >
+              <svg
+                aria-hidden={true}
+                className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                fill="currentColor"
+                height="1em"
+                viewBox="0 0 20 20"
+                width="1em"
+                xmlns="http://www.w3.org/2000/svg"
+              >
+                <path
+                  d="M15.85 7.65c.2.2.2.5 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16c.2-.2.5-.2.7 0Z"
+                  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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <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_0"
+                >
+                  <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_0__error root_0__description root_0__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_0"
+                    name="root[0]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    type="text"
+                    value="text"
+                  />
+                </span>
+              </div>
+            </div>
+          </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-number"
+            >
+              <div
+                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              >
+                <label
+                  className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                  htmlFor="root_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_1__error root_1__description root_1__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_1"
+                    name="root[1]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    step="any"
+                    type="number"
+                    value={42}
+                  />
+                </span>
+              </div>
+            </div>
+          </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-boolean"
+            >
+              <div
+                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              >
+                <span
+                  className="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
+                >
+                  <input
+                    aria-describedby="root_2__error root_2__description root_2__help"
+                    autoFocus={false}
+                    checked={true}
+                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                    disabled={false}
+                    id="root_2"
+                    name="root[2]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    required={false}
+                    type="checkbox"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Checkbox__indicator rl7ci6d"
+                  >
+                    <svg
+                      aria-hidden={true}
+                      className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                      fill="currentColor"
+                      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
+                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_2"
+                  />
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <div
+          className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+        >
+          <div
+            className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              >
+                <div
+                  className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+                >
+                  <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_0_0"
+                          >
+                            <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_0_0__error root_0_0__description root_0_0__help"
+                              autoFocus={false}
+                              className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              disabled={false}
+                              id="root_0_0"
+                              name="root[0][0]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="a"
+                            />
+                          </span>
+                        </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_0_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        disabled={false}
+                        id="root_0_0__moveDown"
+                        onClick={[Function]}
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_0_0__remove"
+                        onClick={[Function]}
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_0_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_0_1__error root_0_1__description root_0_1__help"
+                              autoFocus={false}
+                              className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              disabled={false}
+                              id="root_0_1"
+                              name="root[0][1]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="b"
+                            />
+                          </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_0_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_0_1__moveDown"
+                        onClick={[Function]}
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_0_1__remove"
+                        onClick={[Function]}
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+                  >
+                    <button
+                      className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      disabled={false}
+                      id="root_0__add"
+                      onClick={[Function]}
+                      title="Add Item"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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
+            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_0__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              disabled={false}
+              id="root_0__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_0__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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-array"
+            >
+              <div
+                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+              >
+                <div
+                  className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+                >
+                  <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_1_0"
+                          >
+                            <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_1_0__error root_1_0__description root_1_0__help"
+                              autoFocus={false}
+                              className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              disabled={false}
+                              id="root_1_0"
+                              name="root[1][0]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="c"
+                            />
+                          </span>
+                        </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_1_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                        disabled={false}
+                        id="root_1_0__moveDown"
+                        onClick={[Function]}
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_1_0__remove"
+                        onClick={[Function]}
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_1_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_1_1__error root_1_1__description root_1_1__help"
+                              autoFocus={false}
+                              className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                              disabled={false}
+                              id="root_1_1"
+                              name="root[1][1]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="d"
+                            />
+                          </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_1_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_1_1__moveDown"
+                        onClick={[Function]}
+                        title="Move down"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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_1_1__remove"
+                        onClick={[Function]}
+                        title="Remove"
+                        type="button"
+                      >
+                        <span
+                          className="fui-Button__icon rywnvv2"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                            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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+                  >
+                    <button
+                      className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      disabled={false}
+                      id="root_1__add"
+                      onClick={[Function]}
+                      title="Add Item"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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
+            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_1__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+        >
+          <button
+            className="fui-Button r1alrhcs rjsf-array-item-add ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <div
+          className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+        >
+          <div
+            className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+          >
+            <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="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_0_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_0_name"
+                            name="root.0.name"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 1"
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <label
+                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          htmlFor="root_0_value"
+                        >
+                          value
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_0_value"
+                            name="root.0.value"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={10}
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                </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_0__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              disabled={false}
+              id="root_0__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_0__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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-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="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_1_name"
+                        >
+                          name
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_1_name"
+                            name="root.1.name"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 2"
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <label
+                          className="fui-Label ___zkh2gz0_1ef3qts fk6fouc f19n0e5 fkhj508 f1i3iumi fq1loh5 futqtb8 f14rdt9"
+                          htmlFor="root_1_value"
+                        >
+                          value
+                        </label>
+                        <span
+                          className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                        >
+                          <input
+                            aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                            autoFocus={false}
+                            className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                            disabled={false}
+                            id="root_1_value"
+                            name="root.1.value"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={20}
+                          />
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                </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_1__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+        >
+          <button
+            className="fui-Button r1alrhcs rjsf-array-item-add ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+    >
+      <div
+        className="fui-Flex ___7chxox0_17y04c0 f22iagw f1vx9l62 f4akndk fe5j3v"
+      >
+        <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_0"
+                >
+                  <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_0__error root_0__description root_0__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_0"
+                    name="root.0"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    type="text"
+                    value="foo"
+                  />
+                </span>
+              </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_0__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+              disabled={false}
+              id="root_0__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_0__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_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_1__error root_1__description root_1__help"
+                    autoFocus={false}
+                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                    disabled={false}
+                    id="root_1"
+                    name="root.1"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={true}
+                    type="text"
+                    value="bar"
+                  />
+                </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_1__moveUp"
+              onClick={[Function]}
+              title="Move up"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__moveDown"
+              onClick={[Function]}
+              title="Move down"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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_1__remove"
+              onClick={[Function]}
+              title="Remove"
+              type="button"
+            >
+              <span
+                className="fui-Button__icon rywnvv2"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                  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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+        >
+          <button
+            className="fui-Button r1alrhcs rjsf-array-item-add ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/fluentui-rc/test/__snapshots__/Form.test.tsx.snap b/packages/fluentui-rc/test/__snapshots__/Form.test.tsx.snap
index 29a4426c02..450ed6ca69 100644
--- a/packages/fluentui-rc/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/fluentui-rc/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,3339 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 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="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_tasks__title"
+              >
+                <h5
+                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                  style={
+                    {
+                      "marginBlock": 0,
+                    }
+                  }
+                >
+                  tasks
+                </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"
+              >
+                <div
+                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+                >
+                  <div
+                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <div
+                          className="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_tasks_0__title"
+                        >
+                          <h5
+                            className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style={
+                              {
+                                "marginBlock": 0,
+                              }
+                            }
+                          >
+                            tasks-1
+                          </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"
+                        >
+                          <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_tasks_0_title"
+                                >
+                                  title
+                                </label>
+                                <span
+                                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                    autoFocus={false}
+                                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    disabled={false}
+                                    id="root_tasks_0_title"
+                                    name="root[tasks][0][title]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 1"
+                                  />
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-boolean"
+                            >
+                              <div
+                                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              >
+                                <span
+                                  className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    autoFocus={false}
+                                    checked={false}
+                                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root[tasks][0][done]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    required={false}
+                                    type="checkbox"
+                                  />
+                                  <div
+                                    aria-hidden={true}
+                                    className="fui-Checkbox__indicator rl7ci6d"
+                                  />
+                                  <label
+                                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                                    htmlFor="root_tasks_0_done"
+                                  >
+                                    done
+                                  </label>
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </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_tasks_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      disabled={false}
+                      id="root_tasks_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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-object"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <div
+                          className="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_tasks_1__title"
+                        >
+                          <h5
+                            className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style={
+                              {
+                                "marginBlock": 0,
+                              }
+                            }
+                          >
+                            tasks-2
+                          </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"
+                        >
+                          <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_tasks_1_title"
+                                >
+                                  title
+                                </label>
+                                <span
+                                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                    autoFocus={false}
+                                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    disabled={false}
+                                    id="root_tasks_1_title"
+                                    name="root[tasks][1][title]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 2"
+                                  />
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-boolean"
+                            >
+                              <div
+                                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              >
+                                <span
+                                  className="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    autoFocus={false}
+                                    checked={true}
+                                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root[tasks][1][done]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    required={false}
+                                    type="checkbox"
+                                  />
+                                  <div
+                                    aria-hidden={true}
+                                    className="fui-Checkbox__indicator rl7ci6d"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                                      fill="currentColor"
+                                      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
+                                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                                    htmlFor="root_tasks_1_done"
+                                  >
+                                    done
+                                  </label>
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </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_tasks_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+                >
+                  <button
+                    className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                    disabled={false}
+                    id="root_tasks__add"
+                    onClick={[Function]}
+                    title="Add Item"
+                    type="button"
+                  >
+                    <span
+                      className="fui-Button__icon rywnvv2"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 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="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_tags__title"
+              >
+                <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"
+              >
+                <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_0"
+                        >
+                          tags-0
+                          <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_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="foo"
+                          />
+                        </span>
+                      </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_tags_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="bar"
+                          />
+                        </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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 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="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <label
+                className="fui-Label ___1yevxz2_yljzsa0 fk6fouc f19n0e5 fkhj508 f1i3iumi"
+                htmlFor="root_choices"
+              >
+                choices
+              </label>
+              <div
+                className="fui-Flex ___1ccp5kb_1s932w9 f22iagw f1vx9l62"
+              >
+                <span
+                  className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+                >
+                  <input
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    autoFocus={false}
+                    checked={false}
+                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                    disabled={false}
+                    id="root_choices-0"
+                    name="root[choices][]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    type="checkbox"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Checkbox__indicator rl7ci6d"
+                  />
+                  <label
+                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_choices-0"
+                  >
+                    foo
+                  </label>
+                </span>
+                <span
+                  className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+                >
+                  <input
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    autoFocus={false}
+                    checked={false}
+                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                    disabled={false}
+                    id="root_choices-1"
+                    name="root[choices][]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    type="checkbox"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Checkbox__indicator rl7ci6d"
+                  />
+                  <label
+                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_choices-1"
+                  >
+                    bar
+                  </label>
+                </span>
+                <span
+                  className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+                >
+                  <input
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    autoFocus={false}
+                    checked={false}
+                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                    disabled={false}
+                    id="root_choices-2"
+                    name="root[choices][]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    type="checkbox"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Checkbox__indicator rl7ci6d"
+                  />
+                  <label
+                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_choices-2"
+                  >
+                    baz
+                  </label>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 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="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_person__title"
+              >
+                <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"
+              >
+                <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_person_firstName"
+                      >
+                        firstName
+                      </label>
+                      <span
+                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      >
+                        <input
+                          aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                          autoFocus={false}
+                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                          disabled={false}
+                          id="root_person_firstName"
+                          name="root[person][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",
+                    }
+                  }
+                >
+                  <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_person_lastName"
+                      >
+                        lastName
+                      </label>
+                      <span
+                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      >
+                        <input
+                          aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                          autoFocus={false}
+                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                          disabled={false}
+                          id="root_person_lastName"
+                          name="root[person][lastName]"
+                          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",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                    >
+                      <div
+                        className="___12hmf4e_0000000 f2zxqi febqm8h"
+                        id="root_person_address__title"
+                      >
+                        <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"
+                      >
+                        <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_person_address_street"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                        <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_person_address_city"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 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="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <label
+                className="fui-Label ___1yevxz2_yljzsa0 fk6fouc f19n0e5 fkhj508 f1i3iumi"
+                htmlFor="root_option"
+              >
+                option
+              </label>
+              <div
+                aria-describedby="root_option__error root_option__description root_option__help"
+                className="fui-RadioGroup ___1tjgnp0_1mgmpxf f22iagw f6jr5hl f1vx9l62"
+                id="root_option"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                role="radiogroup"
+              >
+                <span
+                  className="fui-Radio r1siqwd8"
+                >
+                  <input
+                    aria-describedby="root_option__error root_option__description root_option__help"
+                    className="fui-Radio__input rg1upok ___183j3wl_1dim0pv f9ma1gx"
+                    disabled={false}
+                    id="root_option-0"
+                    name="root[option]"
+                    onChange={[Function]}
+                    type="radio"
+                    value="0"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Radio__indicator rwtekvw"
+                  />
+                  <label
+                    className="fui-Label fui-Radio__label ___pfgtpr0_5m9p670 fk6fouc f19n0e5 fkhj508 f1i3iumi f7nlbp4 fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_option-0"
+                  >
+                    foo
+                  </label>
+                </span>
+                <span
+                  className="fui-Radio r1siqwd8"
+                >
+                  <input
+                    aria-describedby="root_option__error root_option__description root_option__help"
+                    className="fui-Radio__input rg1upok ___183j3wl_1dim0pv f9ma1gx"
+                    disabled={false}
+                    id="root_option-1"
+                    name="root[option]"
+                    onChange={[Function]}
+                    type="radio"
+                    value="1"
+                  />
+                  <div
+                    aria-hidden={true}
+                    className="fui-Radio__indicator rwtekvw"
+                  />
+                  <label
+                    className="fui-Label fui-Radio__label ___pfgtpr0_5m9p670 fk6fouc f19n0e5 fkhj508 f1i3iumi f7nlbp4 fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                    htmlFor="root_option-1"
+                  >
+                    bar
+                  </label>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 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="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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-r8v__control"
+                  id="field-r8v__label"
+                >
+                  color
+                </label>
+                <div
+                  className="fui-Dropdown form-control ___y239tk0_6yts2b0 ft85np5 f1ewtqcl ftuwxu6 f1exfvgq f10pi13n fmrv4ls f14a1fxs f3e99gv fhljsf7 f1gw3sf2 f13zj6fq f1mdlcz9 f1a7op3 f1gboi2j f1cjjd47 ffyw7fx f1kp91vd f1ibwz09 f1mnjydx f13evtba f1yk9hq fhwpy7i f14ee0xe f1xhbsuh fv8e3ye ftb5wc6 fjw5xc1 f1xdyd5c fatpbeo fb7uyps f1cmft4k f1x58t8o f1ibeo51 f132nw8t f1htdosj fxugw4r f1c1zstj fhz96rm fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi fvs00aa f1assf6x f1z0osm6 f4ruux4 f1b473iu f381qr8 f1qzcrsd ft4skwv"
+                >
+                  <button
+                    aria-describedby="root_color__error root_color__description root_color__help"
+                    aria-expanded={false}
+                    aria-labelledby="field-r8v__label"
+                    autoFocus={false}
+                    className="fui-Dropdown__button ___12pyx89_1vewwra f122n59 f1c21dwh f3bhgqh f1ewtqcl f19n0e5 f14mj54c f1k6fduh f13qh94s fk6fouc f12nh0o2 f1869bpl f1o700av fly5x3f ftqa4ok fkhj508 figsok6 f1i3iumi f14ev680"
+                    disabled={false}
+                    id="root_color"
+                    name="root[color]"
+                    onBlur={[Function]}
+                    onClick={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    role="combobox"
+                    tabIndex={0}
+                    type="button"
+                    value=""
+                  >
+                    <span
+                      className="fui-Dropdown__expandIcon ___5y6ahy0_3cm10l0 f1ewtqcl fxkbij4 ftgm304 fe5j1ua f12w6cgp f8bv1bt fvc9v3g f1h9en5y"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        fill="currentColor"
+                        height="1em"
+                        viewBox="0 0 20 20"
+                        width="1em"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="M15.85 7.65c.2.2.2.5 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16c.2-.2.5-.2.7 0Z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </span>
+                  </button>
+                  <button
+                    aria-label="Clear selection"
+                    className="fui-Dropdown__clearButton rticfuj ___1ijk9xi_1ynmboo f1ewtqcl fxkbij4 fjseox fe5j1ua f12w6cgp f8bv1bt fvc9v3g f1h9en5y"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden={true}
+                      className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="m4.09 4.22.06-.07a.5.5 0 0 1 .63-.06l.07.06L10 9.29l5.15-5.14a.5.5 0 0 1 .63-.06l.07.06c.18.17.2.44.06.63l-.06.07L10.71 10l5.14 5.15c.18.17.2.44.06.63l-.06.07a.5.5 0 0 1-.63.06l-.07-.06L10 10.71l-5.15 5.14a.5.5 0 0 1-.63.06l-.07-.06a.5.5 0 0 1-.06-.63l.06-.07L9.29 10 4.15 4.85a.5.5 0 0 1-.06-.63l.06-.07-.06.07Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 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="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",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-boolean"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <span
+                className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+              >
+                <input
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  autoFocus={false}
+                  checked={false}
+                  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"
+                />
+                <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>
+            </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[`nameGenerator bracketNameGenerator textarea field 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="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_description"
+              >
+                description
+              </label>
+              <span
+                className="fui-Textarea ___2wx44n0_184o527 ftuwxu6 f1ewtqcl f10pi13n f1yiegib f1s184ao ft85np5 f12kltsn fxugw4r f1c1zstj fhz96rm f1gw3sf2 f13zj6fq f1mdlcz9 f1a7op3 f1gboi2j f1cjjd47 ffyw7fx f1kp91vd f1ibwz09 f1mnjydx fj2g8qd f1yk9hq fhwpy7i f14ee0xe f1xhbsuh fv8e3ye ftb5wc6 fjw5xc1 f1xdyd5c fatpbeo fb7uyps f1cmft4k f1x58t8o f1ibeo51 f1vnc8sk f3e99gv fhljsf7 f1l4zc64 f9mts5e f1z0osm6 f1acnei2 f1so894s f19ezbcq"
+              >
+                <textarea
+                  aria-describedby="root_description__error root_description__description root_description__help"
+                  autoFocus={false}
+                  className="fui-Textarea__textarea ___1exmw6r_wmtmdb0 f1ern45e f1n71otn f1h8hb77 f1deefiw f1s184ao f3rmtva f1ewtqcl f19n0e5 fqerorx fk6fouc f1l02sjl fwyc1cq f13ta7ih f1s6fcnf fvmd9f f1ww82xo f1if7ixc fkhj508 figsok6 f1i3iumi f1o1s39h"
+                  disabled={false}
+                  id="root_description"
+                  name="root[description]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  placeholder=""
+                  required={false}
+                  rows={5}
+                  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[`nameGenerator dotNotationNameGenerator array of objects 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="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_tasks__title"
+              >
+                <h5
+                  className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                  style={
+                    {
+                      "marginBlock": 0,
+                    }
+                  }
+                >
+                  tasks
+                </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"
+              >
+                <div
+                  className="fui-Flex ___14l2n00_8jr2f20 f22iagw fgs5rwf"
+                >
+                  <div
+                    className="fui-Flex ___9stze40_16wdn2w f22iagw fly5x3f f1l02sjl fzy362"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <div
+                          className="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_tasks_0__title"
+                        >
+                          <h5
+                            className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style={
+                              {
+                                "marginBlock": 0,
+                              }
+                            }
+                          >
+                            tasks-1
+                          </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"
+                        >
+                          <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_tasks_0_title"
+                                >
+                                  title
+                                </label>
+                                <span
+                                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                    autoFocus={false}
+                                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    disabled={false}
+                                    id="root_tasks_0_title"
+                                    name="root.tasks.0.title"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 1"
+                                  />
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-boolean"
+                            >
+                              <div
+                                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              >
+                                <span
+                                  className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    autoFocus={false}
+                                    checked={false}
+                                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root.tasks.0.done"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    required={false}
+                                    type="checkbox"
+                                  />
+                                  <div
+                                    aria-hidden={true}
+                                    className="fui-Checkbox__indicator rl7ci6d"
+                                  />
+                                  <label
+                                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                                    htmlFor="root_tasks_0_done"
+                                  >
+                                    done
+                                  </label>
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </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_tasks_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                      disabled={false}
+                      id="root_tasks_0__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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-object"
+                    >
+                      <div
+                        className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                      >
+                        <div
+                          className="___12hmf4e_0000000 f2zxqi febqm8h"
+                          id="root_tasks_1__title"
+                        >
+                          <h5
+                            className="fui-Text ___1bmgkdy_1xttbln fk6fouc f1x0m3f5 fb86gi6 figsok6 fpgzoln f1w7gpdv f6juhto f1gl81tg f2jf649"
+                            style={
+                              {
+                                "marginBlock": 0,
+                              }
+                            }
+                          >
+                            tasks-2
+                          </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"
+                        >
+                          <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_tasks_1_title"
+                                >
+                                  title
+                                </label>
+                                <span
+                                  className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                    autoFocus={false}
+                                    className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                                    disabled={false}
+                                    id="root_tasks_1_title"
+                                    name="root.tasks.1.title"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 2"
+                                  />
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-boolean"
+                            >
+                              <div
+                                className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                              >
+                                <span
+                                  className="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    autoFocus={false}
+                                    checked={true}
+                                    className="fui-Checkbox__input ruo9svu ___qlal8r0_1xrlghj f1vgc2s3"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root.tasks.1.done"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    required={false}
+                                    type="checkbox"
+                                  />
+                                  <div
+                                    aria-hidden={true}
+                                    className="fui-Checkbox__indicator rl7ci6d"
+                                  >
+                                    <svg
+                                      aria-hidden={true}
+                                      className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                                      fill="currentColor"
+                                      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
+                                    className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                                    htmlFor="root_tasks_1_done"
+                                  >
+                                    done
+                                  </label>
+                                </span>
+                              </div>
+                            </div>
+                          </div>
+                        </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_tasks_1__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_tasks_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___1ncave0_cx496c0 f22iagw f9c4gz4"
+                >
+                  <button
+                    className="fui-Button r1alrhcs rjsf-array-item-add ___1j82qye_10z14xp f18ktai2 fwbmr0d f44c6la"
+                    disabled={false}
+                    id="root_tasks__add"
+                    onClick={[Function]}
+                    title="Add Item"
+                    type="button"
+                  >
+                    <span
+                      className="fui-Button__icon rywnvv2"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 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="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_tags__title"
+              >
+                <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"
+              >
+                <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_0"
+                        >
+                          tags-0
+                          <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_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="foo"
+                          />
+                        </span>
+                      </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_tags_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="bar"
+                          />
+                        </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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 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="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_person__title"
+              >
+                <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"
+              >
+                <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_person_firstName"
+                      >
+                        firstName
+                      </label>
+                      <span
+                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      >
+                        <input
+                          aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                          autoFocus={false}
+                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                          disabled={false}
+                          id="root_person_firstName"
+                          name="root.person.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",
+                    }
+                  }
+                >
+                  <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_person_lastName"
+                      >
+                        lastName
+                      </label>
+                      <span
+                        className="fui-Input r1oeeo9n ___1v9icnz_137yv9i fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi f8vnjqi fz1etlk f1klwx88 f1hc16gm"
+                      >
+                        <input
+                          aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                          autoFocus={false}
+                          className="fui-Input__input r12stul0 ___cqaz2i0_9xw1o20 fly5x3f"
+                          disabled={false}
+                          id="root_person_lastName"
+                          name="root.person.lastName"
+                          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",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                    >
+                      <div
+                        className="___12hmf4e_0000000 f2zxqi febqm8h"
+                        id="root_person_address__title"
+                      >
+                        <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"
+                      >
+                        <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_person_address_street"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                        <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_person_address_city"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 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="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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-raf__control"
+                  id="field-raf__label"
+                >
+                  color
+                </label>
+                <div
+                  className="fui-Dropdown form-control ___y239tk0_6yts2b0 ft85np5 f1ewtqcl ftuwxu6 f1exfvgq f10pi13n fmrv4ls f14a1fxs f3e99gv fhljsf7 f1gw3sf2 f13zj6fq f1mdlcz9 f1a7op3 f1gboi2j f1cjjd47 ffyw7fx f1kp91vd f1ibwz09 f1mnjydx f13evtba f1yk9hq fhwpy7i f14ee0xe f1xhbsuh fv8e3ye ftb5wc6 fjw5xc1 f1xdyd5c fatpbeo fb7uyps f1cmft4k f1x58t8o f1ibeo51 f132nw8t f1htdosj fxugw4r f1c1zstj fhz96rm fvcxoqz f1ub3y4t f1l4zc64 f1m52nbi fvs00aa f1assf6x f1z0osm6 f4ruux4 f1b473iu f381qr8 f1qzcrsd ft4skwv"
+                >
+                  <button
+                    aria-describedby="root_color__error root_color__description root_color__help"
+                    aria-expanded={false}
+                    aria-labelledby="field-raf__label"
+                    autoFocus={false}
+                    className="fui-Dropdown__button ___12pyx89_1vewwra f122n59 f1c21dwh f3bhgqh f1ewtqcl f19n0e5 f14mj54c f1k6fduh f13qh94s fk6fouc f12nh0o2 f1869bpl f1o700av fly5x3f ftqa4ok fkhj508 figsok6 f1i3iumi f14ev680"
+                    disabled={false}
+                    id="root_color"
+                    name="root.color"
+                    onBlur={[Function]}
+                    onClick={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    role="combobox"
+                    tabIndex={0}
+                    type="button"
+                    value=""
+                  >
+                    <span
+                      className="fui-Dropdown__expandIcon ___5y6ahy0_3cm10l0 f1ewtqcl fxkbij4 ftgm304 fe5j1ua f12w6cgp f8bv1bt fvc9v3g f1h9en5y"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        fill="currentColor"
+                        height="1em"
+                        viewBox="0 0 20 20"
+                        width="1em"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <path
+                          d="M15.85 7.65c.2.2.2.5 0 .7l-5.46 5.49a.55.55 0 0 1-.78 0L4.15 8.35a.5.5 0 1 1 .7-.7L10 12.8l5.15-5.16c.2-.2.5-.2.7 0Z"
+                          fill="currentColor"
+                        />
+                      </svg>
+                    </span>
+                  </button>
+                  <button
+                    aria-label="Clear selection"
+                    className="fui-Dropdown__clearButton rticfuj ___1ijk9xi_1ynmboo f1ewtqcl fxkbij4 fjseox fe5j1ua f12w6cgp f8bv1bt fvc9v3g f1h9en5y"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <svg
+                      aria-hidden={true}
+                      className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                      fill="currentColor"
+                      height="1em"
+                      viewBox="0 0 20 20"
+                      width="1em"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <path
+                        d="m4.09 4.22.06-.07a.5.5 0 0 1 .63-.06l.07.06L10 9.29l5.15-5.14a.5.5 0 0 1 .63-.06l.07.06c.18.17.2.44.06.63l-.06.07L10.71 10l5.14 5.15c.18.17.2.44.06.63l-.06.07a.5.5 0 0 1-.63.06l-.07-.06L10 10.71l-5.15 5.14a.5.5 0 0 1-.63.06l-.07-.06a.5.5 0 0 1-.06-.63l.06-.07L9.29 10 4.15 4.85a.5.5 0 0 1-.06-.63l.06-.07-.06.07Z"
+                        fill="currentColor"
+                      />
+                    </svg>
+                  </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 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="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",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-boolean"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <span
+                className="fui-Checkbox r1q22k1j ___1v6wcsu_941lme0 f3p8bqa fium13f f1r2dosr f1729es6"
+              >
+                <input
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  autoFocus={false}
+                  checked={false}
+                  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"
+                />
+                <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>
+            </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[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap b/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
index 324db82853..eda2bb3e57 100644
--- a/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/fluentui-rc/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,2053 @@
 // 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"
+  >
+    <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="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_person__title"
+              >
+                <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"
+              >
+                <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_person_name"
+                      >
+                        name
+                      </label>
+                      <span
+                        className="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"
+                          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>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                    >
+                      <div
+                        className="___12hmf4e_0000000 f2zxqi febqm8h"
+                        id="root_person_address__title"
+                      >
+                        <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"
+                      >
+                        <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_person_address_street"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                        <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_person_address_city"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                        <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_person_address_country"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with 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="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_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"
+              >
+                <label
+                  className="fui-Label fui-Field__label ___1r7nw7g_2qzl200 fk6fouc f19n0e5 fkhj508 f1i3iumi fclwglc fywfov9 fyacil5"
+                  htmlFor="field-r21__control"
+                  id="field-r21__label"
+                >
+                  customField Key
+                </label>
+                <span
+                  className="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}
+                    type="text"
+                    value="customField"
+                  />
+                </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"
+                >
+                  <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>
+              </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"
+                >
+                  <svg
+                    aria-hidden={true}
+                    className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                    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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 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="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_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="Alice"
+                />
+              </span>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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={30}
+                />
+              </span>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-boolean"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <span
+                className="fui-Checkbox r1q22k1j ___13877ya_6gg83z0 f19n0e5 f35ds98 f12mnkne fei9a8h fix56y3 f1bcv2js f7dr4go f1r5cpua"
+              >
+                <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"
+                >
+                  <svg
+                    aria-hidden={true}
+                    className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                    fill="currentColor"
+                    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
+                  className="fui-Label fui-Checkbox__label ___z217dr0_6ezprl0 fk6fouc f1ym3bx4 fkhj508 f1i3iumi f7nlbp4 fpo1scq fruq291 f1f5q0n8 fjzwpt6 fh6j2fo"
+                  htmlFor="root_active"
+                >
+                  active
+                </label>
+              </span>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_tags__title"
+              >
+                <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"
+              >
+                <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_0"
+                        >
+                          tags-0
+                          <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_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"
+                          />
+                        </span>
+                      </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_tags_0__moveUp"
+                      onClick={[Function]}
+                      title="Move up"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 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="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",
+            }
+          }
+        >
+          <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_lastName"
+              >
+                lastName
+              </label>
+              <span
+                className="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"
+                  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>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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[`nameGenerator dotNotationNameGenerator nested object 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="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_person__title"
+              >
+                <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"
+              >
+                <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_person_name"
+                      >
+                        name
+                      </label>
+                      <span
+                        className="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"
+                          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>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+                    >
+                      <div
+                        className="___12hmf4e_0000000 f2zxqi febqm8h"
+                        id="root_person_address__title"
+                      >
+                        <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"
+                      >
+                        <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_person_address_street"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                        <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_person_address_city"
+                              >
+                                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>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 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="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_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="Test"
+                />
+              </span>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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"
+              >
+                <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>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <div
+                className="___12hmf4e_0000000 f2zxqi febqm8h"
+                id="root_items__title"
+              >
+                <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"
+              >
+                <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_items_0"
+                        >
+                          items-0
+                          <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_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
+                    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"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_items_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_items_1"
+                        >
+                          items-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_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
+                    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"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_items_1__moveDown"
+                      onClick={[Function]}
+                      title="Move down"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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_items_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                      type="button"
+                    >
+                      <span
+                        className="fui-Button__icon rywnvv2"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                          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 ___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="___12fm75w_1fmvgpr f1w7gpdv fez10in fg4l7m0"
+                        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"
+    >
+      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
+      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="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",
+            }
+          }
+        >
+          <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_lastName"
+              >
+                lastName
+              </label>
+              <span
+                className="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"
+                  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>
+            </div>
+          </div>
+        </div>
+        <div
+          className="fui-Flex ___13jx0ny_nlbnai0 f22iagw f1vx9l62 fly5x3f f1l02sjl"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-number"
+          >
+            <div
+              className="fui-Field ___keyyzl0_1dbn5sh f13qh94s"
+            >
+              <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"
diff --git a/packages/mantine/test/__snapshots__/Array.test.tsx.snap b/packages/mantine/test/__snapshots__/Array.test.tsx.snap
index d996c2c159..9165cc7636 100644
--- a/packages/mantine/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/mantine/test/__snapshots__/Array.test.tsx.snap
@@ -3339,6 +3339,8816 @@ exports[`array fields no errors 1`] = `
 ]
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": null,
+                                        "props": {
+                                          "dangerouslySetInnerHTML": {
+                                            "__html": ".__m__-ris{--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_0_name",
+                                                          "id": "root_0_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_0_name",
+                                                              "name": "root[0][name]",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "Item 1",
+                                                            },
+                                                            "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": [
+                                                          "value",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8fdc1311",
+                                                          "data-size": "sm",
+                                                          "data-variant": undefined,
+                                                          "htmlFor": "root_0_value",
+                                                          "id": "root_0_value-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_0_value",
+                                                              "inputMode": "numeric",
+                                                              "name": "root[0][value]",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "onKeyDown": [Function],
+                                                              "onKeyDownCapture": [Function],
+                                                              "onMouseUp": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "10",
+                                                            },
+                                                            "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__-ris",
+                                          "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_0",
+                                      "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": {
+                                "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_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_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_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__-rio",
+                          "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": null,
+                                        "props": {
+                                          "dangerouslySetInnerHTML": {
+                                            "__html": ".__m__-rjo{--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_1_name",
+                                                          "id": "root_1_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_1_name",
+                                                              "name": "root[1][name]",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "Item 2",
+                                                            },
+                                                            "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": [
+                                                          "value",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8fdc1311",
+                                                          "data-size": "sm",
+                                                          "data-variant": undefined,
+                                                          "htmlFor": "root_1_value",
+                                                          "id": "root_1_value-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_1_value",
+                                                              "inputMode": "numeric",
+                                                              "name": "root[1][value]",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "onKeyDown": [Function],
+                                                              "onKeyDownCapture": [Function],
+                                                              "onMouseUp": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "20",
+                                                            },
+                                                            "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__-rjo",
+                                          "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_1",
+                                      "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": {
+                                "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_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_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_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__-rjk",
+                          "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__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-object m_e9408a47",
+              "data-size": undefined,
+              "data-variant": "default",
+              "id": "root",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "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_0",
+                                              "name": "root[0]",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "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": "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_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_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_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__-rhj",
+                          "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": [
+                                          {
+                                            "children": null,
+                                            "props": {
+                                              "aria-describedby": undefined,
+                                              "aria-invalid": false,
+                                              "autoFocus": false,
+                                              "className": "m_8fb7ebe7",
+                                              "data-size": undefined,
+                                              "data-variant": "default",
+                                              "disabled": false,
+                                              "id": "root_1",
+                                              "name": "root[1]",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "size": undefined,
+                                              "style": {},
+                                              "type": "text",
+                                              "value": "bar",
+                                            },
+                                            "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_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_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_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__-ri2",
+                          "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__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",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": null,
+                            "props": {
+                              "aria-describedby": undefined,
+                              "aria-haspopup": "listbox",
+                              "aria-invalid": false,
+                              "autoComplete": "off",
+                              "autoFocus": false,
+                              "className": "m_45c4369d",
+                              "data-size": undefined,
+                              "data-type": "visible",
+                              "data-variant": undefined,
+                              "disabled": false,
+                              "id": "root",
+                              "onBlur": [Function],
+                              "onChange": [Function],
+                              "onFocus": [Function],
+                              "onKeyDown": [Function],
+                              "onMouseDown": [Function],
+                              "readOnly": false,
+                              "size": undefined,
+                              "style": {},
+                              "type": "text",
+                              "value": "",
+                            },
+                            "type": "input",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "m_1dcfd90b",
+                          "data-size": "sm",
+                          "data-variant": undefined,
+                          "size": undefined,
+                          "style": {
+                            "--pg-gap": "var(--pg-gap-sm)",
+                          },
+                        },
+                        "type": "div",
+                        Symbol(cleaned): true,
+                      },
+                    ],
+                    "props": {
+                      "className": "m_8fb7ebe7",
+                      "data-no-overflow": true,
+                      "data-size": undefined,
+                      "data-variant": "default",
+                      "onClick": [Function],
+                      "onMouseDown": [Function],
+                      "required": false,
+                      "size": undefined,
+                      "style": {},
+                    },
+                    "type": "div",
+                    Symbol(cleaned): true,
+                  },
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": null,
+                            "props": {
+                              "clipRule": "evenodd",
+                              "d": "M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z",
+                              "fill": "currentColor",
+                              "fillRule": "evenodd",
+                            },
+                            "type": "path",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "m_2943220b",
+                          "data-combobox-chevron": true,
+                          "data-size": "sm",
+                          "data-variant": undefined,
+                          "fill": "none",
+                          "size": undefined,
+                          "style": {
+                            "--combobox-chevron-size": "var(--combobox-chevron-size-sm)",
+                          },
+                          "viewBox": "0 0 15 15",
+                          "xmlns": "http://www.w3.org/2000/svg",
+                        },
+                        "type": "svg",
+                        Symbol(cleaned): true,
+                      },
+                    ],
+                    "props": {
+                      "className": "m_82577fc2",
+                      "data-position": "right",
+                      "style": {},
+                    },
+                    "type": "div",
+                    Symbol(cleaned): true,
+                  },
+                ],
+                "props": {
+                  "className": "m_6c018570",
+                  "data-multiline": true,
+                  "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-padding-y": "var(--input-padding-y-sm)",
+                    "--input-right-section-pointer-events": "none",
+                  },
+                },
+                "type": "div",
+                Symbol(cleaned): true,
+              },
+            ],
+            "props": {
+              "className": "m_46b77525",
+              "data-size": "sm",
+              "data-variant": undefined,
+              "size": undefined,
+              "style": {},
+            },
+            "type": "div",
+            Symbol(cleaned): true,
+          },
+          {
+            "children": [
+              {
+                "children": [
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              "foo",
+                                            ],
+                                            "props": {},
+                                            "type": "span",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "aria-selected": false,
+                                          "className": "m_92253aa5 m_390b5f4",
+                                          "data-combobox-option": true,
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "id": ":rp7:",
+                                          "onClick": [Function],
+                                          "onMouseDown": [Function],
+                                          "onMouseOver": [Function],
+                                          "role": "option",
+                                          "size": undefined,
+                                          "style": {},
+                                          "value": "0",
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              "bar",
+                                            ],
+                                            "props": {},
+                                            "type": "span",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "aria-selected": false,
+                                          "className": "m_92253aa5 m_390b5f4",
+                                          "data-combobox-option": true,
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "id": ":rp9:",
+                                          "onClick": [Function],
+                                          "onMouseDown": [Function],
+                                          "onMouseOver": [Function],
+                                          "role": "option",
+                                          "size": undefined,
+                                          "style": {},
+                                          "value": "1",
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              "baz",
+                                            ],
+                                            "props": {},
+                                            "type": "span",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "aria-selected": false,
+                                          "className": "m_92253aa5 m_390b5f4",
+                                          "data-combobox-option": true,
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "id": ":rpb:",
+                                          "onClick": [Function],
+                                          "onMouseDown": [Function],
+                                          "onMouseOver": [Function],
+                                          "role": "option",
+                                          "size": undefined,
+                                          "style": {},
+                                          "value": "2",
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                    ],
+                                    "props": {
+                                      "className": "m_b1336c6",
+                                      "style": {},
+                                    },
+                                    "type": "div",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "className": "m_c0783ff9",
+                                  "data-horizontal-hidden": undefined,
+                                  "data-offset-scrollbars": "y",
+                                  "data-scrollbars": "xy",
+                                  "data-size": undefined,
+                                  "data-variant": undefined,
+                                  "data-vertical-hidden": undefined,
+                                  "onScroll": [Function],
+                                  "size": undefined,
+                                  "style": {
+                                    "overflowX": "scroll",
+                                    "overflowY": "scroll",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                              {
+                                "children": null,
+                                "props": {
+                                  "className": "m_c44ba933",
+                                  "data-hidden": undefined,
+                                  "data-mantine-scrollbar": true,
+                                  "data-orientation": "horizontal",
+                                  "data-state": "hidden",
+                                  "onLostPointerCapture": [Function],
+                                  "onMouseEnter": [Function],
+                                  "onMouseLeave": [Function],
+                                  "onPointerDown": [Function],
+                                  "onPointerEnter": [Function],
+                                  "onPointerLeave": [Function],
+                                  "onPointerMove": [Function],
+                                  "onPointerUp": [Function],
+                                  "style": {
+                                    "--sa-thumb-width": "18px",
+                                    "position": "absolute",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                              {
+                                "children": null,
+                                "props": {
+                                  "className": "m_c44ba933",
+                                  "data-hidden": undefined,
+                                  "data-mantine-scrollbar": true,
+                                  "data-orientation": "vertical",
+                                  "data-state": "hidden",
+                                  "onLostPointerCapture": [Function],
+                                  "onMouseEnter": [Function],
+                                  "onMouseLeave": [Function],
+                                  "onPointerDown": [Function],
+                                  "onPointerEnter": [Function],
+                                  "onPointerLeave": [Function],
+                                  "onPointerMove": [Function],
+                                  "onPointerUp": [Function],
+                                  "style": {
+                                    "--sa-thumb-height": "18px",
+                                    "position": "absolute",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "className": "m_d57069b5",
+                              "data-autosize": "true",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "size": undefined,
+                              "style": {
+                                "--sa-corner-height": "0px",
+                                "--sa-corner-width": "0px",
+                                "--scrollarea-scrollbar-size": "var(--combobox-padding)",
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "",
+                          "data-size": undefined,
+                          "data-variant": undefined,
+                          "size": undefined,
+                          "style": {
+                            "display": "flex",
+                            "flex": 1,
+                            "flexDirection": "column",
+                            "minHeight": 0,
+                            "minWidth": 0,
+                            "overflow": "hidden",
+                          },
+                        },
+                        "type": "div",
+                        Symbol(cleaned): true,
+                      },
+                    ],
+                    "props": {
+                      "className": "",
+                      "data-size": undefined,
+                      "data-variant": undefined,
+                      "size": undefined,
+                      "style": {
+                        "display": "flex",
+                        "maxHeight": "calc(13.75rem * var(--mantine-scale))",
+                        "overflow": "hidden",
+                      },
+                    },
+                    "type": "div",
+                    Symbol(cleaned): true,
+                  },
+                ],
+                "props": {
+                  "aria-labelledby": undefined,
+                  "className": "m_b2821a6e",
+                  "data-size": undefined,
+                  "data-variant": undefined,
+                  "id": "",
+                  "onMouseDown": [Function],
+                  "role": "listbox",
+                  "size": undefined,
+                  "style": {
+                    "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                    "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                  },
+                },
+                "type": "div",
+                Symbol(cleaned): true,
+              },
+            ],
+            "props": {
+              "className": "m_38a85659 m_88b62a41",
+              "data-composed": true,
+              "data-fixed": undefined,
+              "data-position": "bottom",
+              "data-size": undefined,
+              "data-variant": undefined,
+              "onKeyDownCapture": [Function],
+              "role": "presentation",
+              "size": undefined,
+              "style": {
+                "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                "display": "none",
+                "left": 0,
+                "top": 0,
+                "width": undefined,
+                "zIndex": 300,
+              },
+            },
+            "type": "div",
+            Symbol(cleaned): true,
+          },
+          {
+            "children": null,
+            "props": {
+              "disabled": false,
+              "form": undefined,
+              "name": "root",
+              "type": "hidden",
+              "value": "",
+            },
+            "type": "input",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "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_0",
+                                              "name": "root[0]",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "size": undefined,
+                                              "style": {},
+                                              "type": "text",
+                                              "value": "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": {
+                                "width": "100%",
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "m_8bffd616 __m__-rkn",
+                          "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": [
+                                          {
+                                            "children": null,
+                                            "props": {
+                                              "aria-describedby": undefined,
+                                              "aria-invalid": false,
+                                              "autoFocus": false,
+                                              "className": "m_8fb7ebe7",
+                                              "data-size": undefined,
+                                              "data-variant": "default",
+                                              "disabled": false,
+                                              "id": "root_1",
+                                              "inputMode": "numeric",
+                                              "name": "root[1]",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "onKeyDown": [Function],
+                                              "onKeyDownCapture": [Function],
+                                              "onMouseUp": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "size": undefined,
+                                              "style": {},
+                                              "type": "text",
+                                              "value": "42",
+                                            },
+                                            "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": {
+                                "width": "100%",
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "m_8bffd616 __m__-rkv",
+                          "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": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": null,
+                                                "props": {
+                                                  "aria-describedby": "root_2__error root_2__description root_2__help",
+                                                  "autoFocus": false,
+                                                  "checked": true,
+                                                  "className": "m_26063560",
+                                                  "data-size": undefined,
+                                                  "data-variant": undefined,
+                                                  "disabled": false,
+                                                  "id": "root_2",
+                                                  "name": "root[2]",
+                                                  "onBlur": [Function],
+                                                  "onChange": [Function],
+                                                  "onFocus": [Function],
+                                                  "required": true,
+                                                  "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": null,
+                                            "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": undefined,
+                                      "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": {
+                                "width": "100%",
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                        ],
+                        "props": {
+                          "className": "m_8bffd616 __m__-rl9",
+                          "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,
+              },
+            ],
+            "props": {
+              "className": "m_84c9523a rjsf-field rjsf-field-array rjsf-field-array-fixed-items m_e9408a47",
+              "data-size": undefined,
+              "data-variant": "default",
+              "id": "root",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "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_0_0",
+                                                                      "name": "root[0][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_0_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_0_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_0_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__-rls",
+                                                  "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": [
+                                                                  {
+                                                                    "children": null,
+                                                                    "props": {
+                                                                      "aria-describedby": undefined,
+                                                                      "aria-invalid": false,
+                                                                      "autoFocus": false,
+                                                                      "className": "m_8fb7ebe7",
+                                                                      "data-size": undefined,
+                                                                      "data-variant": "default",
+                                                                      "disabled": false,
+                                                                      "id": "root_0_1",
+                                                                      "name": "root[0][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_0_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_0_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_0_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__-rmb",
+                                                  "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_0__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_0",
+                                      "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": {
+                                "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_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_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_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__-rlm",
+                          "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": [
+                                          {
+                                            "children": [
+                                              {
+                                                "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_1_0",
+                                                                      "name": "root[1][0]",
+                                                                      "onBlur": [Function],
+                                                                      "onChange": [Function],
+                                                                      "onFocus": [Function],
+                                                                      "placeholder": "",
+                                                                      "required": true,
+                                                                      "size": undefined,
+                                                                      "style": {},
+                                                                      "type": "text",
+                                                                      "value": "c",
+                                                                    },
+                                                                    "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_1_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_1_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_1_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__-rna",
+                                                  "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": [
+                                                                  {
+                                                                    "children": null,
+                                                                    "props": {
+                                                                      "aria-describedby": undefined,
+                                                                      "aria-invalid": false,
+                                                                      "autoFocus": false,
+                                                                      "className": "m_8fb7ebe7",
+                                                                      "data-size": undefined,
+                                                                      "data-variant": "default",
+                                                                      "disabled": false,
+                                                                      "id": "root_1_1",
+                                                                      "name": "root[1][1]",
+                                                                      "onBlur": [Function],
+                                                                      "onChange": [Function],
+                                                                      "onFocus": [Function],
+                                                                      "placeholder": "",
+                                                                      "required": true,
+                                                                      "size": undefined,
+                                                                      "style": {},
+                                                                      "type": "text",
+                                                                      "value": "d",
+                                                                    },
+                                                                    "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_1_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_1_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_1_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__-rnp",
+                                                  "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_1__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_1",
+                                      "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": {
+                                "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_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_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_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__-rn4",
+                          "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__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-array m_e9408a47",
+              "data-size": undefined,
+              "data-variant": "default",
+              "id": "root",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": null,
+                                        "props": {
+                                          "dangerouslySetInnerHTML": {
+                                            "__html": ".__m__-rqr{--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_0_name",
+                                                          "id": "root_0_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_0_name",
+                                                              "name": "root.0.name",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "Item 1",
+                                                            },
+                                                            "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": [
+                                                          "value",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8fdc1311",
+                                                          "data-size": "sm",
+                                                          "data-variant": undefined,
+                                                          "htmlFor": "root_0_value",
+                                                          "id": "root_0_value-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_0_value",
+                                                              "inputMode": "numeric",
+                                                              "name": "root.0.value",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "onKeyDown": [Function],
+                                                              "onKeyDownCapture": [Function],
+                                                              "onMouseUp": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "10",
+                                                            },
+                                                            "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__-rqr",
+                                          "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_0",
+                                      "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": {
+                                "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_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_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_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__-rqn",
+                          "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": null,
+                                        "props": {
+                                          "dangerouslySetInnerHTML": {
+                                            "__html": ".__m__-rrn{--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_1_name",
+                                                          "id": "root_1_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_1_name",
+                                                              "name": "root.1.name",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "Item 2",
+                                                            },
+                                                            "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": [
+                                                          "value",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8fdc1311",
+                                                          "data-size": "sm",
+                                                          "data-variant": undefined,
+                                                          "htmlFor": "root_1_value",
+                                                          "id": "root_1_value-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_1_value",
+                                                              "inputMode": "numeric",
+                                                              "name": "root.1.value",
+                                                              "onBlur": [Function],
+                                                              "onChange": [Function],
+                                                              "onFocus": [Function],
+                                                              "onKeyDown": [Function],
+                                                              "onKeyDownCapture": [Function],
+                                                              "onMouseUp": [Function],
+                                                              "placeholder": "",
+                                                              "required": false,
+                                                              "size": undefined,
+                                                              "style": {},
+                                                              "type": "text",
+                                                              "value": "20",
+                                                            },
+                                                            "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__-rrn",
+                                          "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_1",
+                                      "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": {
+                                "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_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_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_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__-rrj",
+                          "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__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-object m_e9408a47",
+              "data-size": undefined,
+              "data-variant": "default",
+              "id": "root",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": [
+                  {
+                    "children": [
+                      {
+                        "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_0",
+                                              "name": "root.0",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "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": "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_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_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_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__-rpi",
+                          "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": [
+                                          {
+                                            "children": null,
+                                            "props": {
+                                              "aria-describedby": undefined,
+                                              "aria-invalid": false,
+                                              "autoFocus": false,
+                                              "className": "m_8fb7ebe7",
+                                              "data-size": undefined,
+                                              "data-variant": "default",
+                                              "disabled": false,
+                                              "id": "root_1",
+                                              "name": "root.1",
+                                              "onBlur": [Function],
+                                              "onChange": [Function],
+                                              "onFocus": [Function],
+                                              "placeholder": "",
+                                              "required": true,
+                                              "size": undefined,
+                                              "style": {},
+                                              "type": "text",
+                                              "value": "bar",
+                                            },
+                                            "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_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_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_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__-rq1",
+                          "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__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",
+              "size": undefined,
+              "style": {},
+            },
+            "type": "fieldset",
+            Symbol(cleaned): true,
+          },
+        ],
+        "props": {
+          "className": "rjsf-field rjsf-field-array",
+          "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,
+  },
+]
+`;
+
 exports[`with title and description array 1`] = `
 [
   <style
diff --git a/packages/mantine/test/__snapshots__/Form.test.tsx.snap b/packages/mantine/test/__snapshots__/Form.test.tsx.snap
index 174974e1fa..e20163f848 100644
--- a/packages/mantine/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/mantine/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,10410 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r185{--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": [
+                                      "tasks",
+                                    ],
+                                    "props": {
+                                      "className": "m_8a5d1357",
+                                      "data-order": 4,
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "id": "root_tasks__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": [
+                                                          "tasks-1",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8a5d1357",
+                                                          "data-order": 3,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": "root_tasks_0__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__-r18h{--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": [
+                                                                          "title",
+                                                                        ],
+                                                                        "props": {
+                                                                          "className": "m_8fdc1311",
+                                                                          "data-size": "sm",
+                                                                          "data-variant": undefined,
+                                                                          "htmlFor": "root_tasks_0_title",
+                                                                          "id": "root_tasks_0_title-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_tasks_0_title",
+                                                                              "name": "root[tasks][0][title]",
+                                                                              "onBlur": [Function],
+                                                                              "onChange": [Function],
+                                                                              "onFocus": [Function],
+                                                                              "placeholder": "",
+                                                                              "required": false,
+                                                                              "size": undefined,
+                                                                              "style": {},
+                                                                              "type": "text",
+                                                                              "value": "Task 1",
+                                                                            },
+                                                                            "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": [
+                                                                              {
+                                                                                "children": null,
+                                                                                "props": {
+                                                                                  "aria-describedby": "root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help",
+                                                                                  "autoFocus": false,
+                                                                                  "checked": false,
+                                                                                  "className": "m_26063560",
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "disabled": false,
+                                                                                  "id": "root_tasks_0_done",
+                                                                                  "name": "root[tasks][0][done]",
+                                                                                  "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": [
+                                                                                  "done",
+                                                                                ],
+                                                                                "props": {
+                                                                                  "className": "m_8ee546b8",
+                                                                                  "data-disabled": undefined,
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "htmlFor": "root_tasks_0_done",
+                                                                                  "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": undefined,
+                                                                      "data-label-position": "right",
+                                                                      "data-size": undefined,
+                                                                      "data-variant": undefined,
+                                                                      "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,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_2415a157 __m__-r18h",
+                                                          "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_tasks_0",
+                                                      "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": {
+                                                "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_tasks_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_tasks_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_tasks_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__-r18c",
+                                          "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": [
+                                                          "tasks-2",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8a5d1357",
+                                                          "data-order": 3,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": "root_tasks_1__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__-r19d{--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": [
+                                                                          "title",
+                                                                        ],
+                                                                        "props": {
+                                                                          "className": "m_8fdc1311",
+                                                                          "data-size": "sm",
+                                                                          "data-variant": undefined,
+                                                                          "htmlFor": "root_tasks_1_title",
+                                                                          "id": "root_tasks_1_title-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_tasks_1_title",
+                                                                              "name": "root[tasks][1][title]",
+                                                                              "onBlur": [Function],
+                                                                              "onChange": [Function],
+                                                                              "onFocus": [Function],
+                                                                              "placeholder": "",
+                                                                              "required": false,
+                                                                              "size": undefined,
+                                                                              "style": {},
+                                                                              "type": "text",
+                                                                              "value": "Task 2",
+                                                                            },
+                                                                            "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": [
+                                                                              {
+                                                                                "children": null,
+                                                                                "props": {
+                                                                                  "aria-describedby": "root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help",
+                                                                                  "autoFocus": false,
+                                                                                  "checked": true,
+                                                                                  "className": "m_26063560",
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "disabled": false,
+                                                                                  "id": "root_tasks_1_done",
+                                                                                  "name": "root[tasks][1][done]",
+                                                                                  "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": [
+                                                                                  "done",
+                                                                                ],
+                                                                                "props": {
+                                                                                  "className": "m_8ee546b8",
+                                                                                  "data-disabled": undefined,
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "htmlFor": "root_tasks_1_done",
+                                                                                  "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": undefined,
+                                                                      "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,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_2415a157 __m__-r19d",
+                                                          "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_tasks_1",
+                                                      "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": {
+                                                "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_tasks_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_tasks_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_tasks_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__-r198",
+                                          "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_tasks__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-object m_e9408a47",
+                              "data-size": undefined,
+                              "data-variant": "default",
+                              "id": "root_tasks",
+                              "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__-r185",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r16p{--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": [
+                                      "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": "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": "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__-r170",
+                                          "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": "bar",
+                                                            },
+                                                            "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__-r17g",
+                                          "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__-r16p",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1bt{--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": [
+                              "choices",
+                            ],
+                            "props": {
+                              "className": "m_8fdc1311",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "htmlFor": undefined,
+                              "id": "root_choices__title",
+                              "onMouseDown": [Function],
+                              "size": undefined,
+                              "style": {},
+                            },
+                            "type": "label",
+                            Symbol(cleaned): true,
+                          },
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": null,
+                                                    "props": {
+                                                      "autoFocus": false,
+                                                      "checked": false,
+                                                      "className": "m_26063560",
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "disabled": false,
+                                                      "id": "root_choices-0",
+                                                      "name": "root[choices][]",
+                                                      "onBlur": [Function],
+                                                      "onChange": [Function],
+                                                      "onFocus": [Function],
+                                                      "size": undefined,
+                                                      "style": {},
+                                                      "type": "checkbox",
+                                                      "value": "0",
+                                                    },
+                                                    "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": [
+                                                      "foo",
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_8ee546b8",
+                                                      "data-disabled": undefined,
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "htmlFor": "root_choices-0",
+                                                      "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": undefined,
+                                          "data-label-position": "right",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "--checkbox-color": "var(--mantine-color-blue-filled)",
+                                            "--label-fz": undefined,
+                                            "--label-lh": undefined,
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": null,
+                                                    "props": {
+                                                      "autoFocus": false,
+                                                      "checked": false,
+                                                      "className": "m_26063560",
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "disabled": false,
+                                                      "id": "root_choices-1",
+                                                      "name": "root[choices][]",
+                                                      "onBlur": [Function],
+                                                      "onChange": [Function],
+                                                      "onFocus": [Function],
+                                                      "size": undefined,
+                                                      "style": {},
+                                                      "type": "checkbox",
+                                                      "value": "1",
+                                                    },
+                                                    "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": [
+                                                      "bar",
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_8ee546b8",
+                                                      "data-disabled": undefined,
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "htmlFor": "root_choices-1",
+                                                      "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": undefined,
+                                          "data-label-position": "right",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "--checkbox-color": "var(--mantine-color-blue-filled)",
+                                            "--label-fz": undefined,
+                                            "--label-lh": undefined,
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": null,
+                                                    "props": {
+                                                      "autoFocus": false,
+                                                      "checked": false,
+                                                      "className": "m_26063560",
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "disabled": false,
+                                                      "id": "root_choices-2",
+                                                      "name": "root[choices][]",
+                                                      "onBlur": [Function],
+                                                      "onChange": [Function],
+                                                      "onFocus": [Function],
+                                                      "size": undefined,
+                                                      "style": {},
+                                                      "type": "checkbox",
+                                                      "value": "2",
+                                                    },
+                                                    "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": [
+                                                      "baz",
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_8ee546b8",
+                                                      "data-disabled": undefined,
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "htmlFor": "root_choices-2",
+                                                      "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": undefined,
+                                          "data-label-position": "right",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "--checkbox-color": "var(--mantine-color-blue-filled)",
+                                            "--label-fz": undefined,
+                                            "--label-lh": undefined,
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                    ],
+                                    "props": {
+                                      "className": "m_8bffd616 __m__-r1c3",
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "size": undefined,
+                                      "style": {
+                                        "flexDirection": "column",
+                                        "flexWrap": "wrap",
+                                        "gap": "var(--mantine-spacing-xs)",
+                                        "marginTop": "var(--mantine-spacing-xs)",
+                                      },
+                                    },
+                                    "type": "div",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "aria-describedby": undefined,
+                                  "aria-labelledby": "root_choices-label",
+                                  "role": "group",
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "aria-describedby": "root_choices__error root_choices__description root_choices__help",
+                              "className": "m_46b77525",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "size": undefined,
+                              "style": {},
+                            },
+                            "type": "div",
+                            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__-r1bt",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r15i{--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__-r15n{--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_person_firstName",
+                                                  "id": "root_person_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_person_firstName",
+                                                      "name": "root[person][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_person_lastName",
+                                                  "id": "root_person_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_person_lastName",
+                                                      "name": "root[person][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": [
+                                                  "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__-r168{--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__-r168",
+                                                  "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__-r15n",
+                                  "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__-r15i",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1b5{--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": [
+                                  "option",
+                                ],
+                                "props": {
+                                  "className": "m_8fdc1311",
+                                  "data-size": undefined,
+                                  "data-variant": undefined,
+                                  "htmlFor": undefined,
+                                  "id": "root_option-label",
+                                  "onMouseDown": [Function],
+                                  "size": undefined,
+                                  "style": {},
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": null,
+                                                    "props": {
+                                                      "autoFocus": false,
+                                                      "checked": false,
+                                                      "className": "m_8a3dbb89",
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "disabled": false,
+                                                      "id": "root_option-0",
+                                                      "name": "root[option]",
+                                                      "onBlur": [Function],
+                                                      "onChange": [Function],
+                                                      "onFocus": [Function],
+                                                      "size": undefined,
+                                                      "style": {},
+                                                      "type": "radio",
+                                                      "value": "0",
+                                                    },
+                                                    "type": "input",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                  {
+                                                    "children": [
+                                                      {
+                                                        "children": null,
+                                                        "props": {
+                                                          "cx": "2.5",
+                                                          "cy": "2.5",
+                                                          "fill": "currentColor",
+                                                          "r": "2.5",
+                                                        },
+                                                        "type": "circle",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                    ],
+                                                    "props": {
+                                                      "aria-hidden": true,
+                                                      "className": "m_f3ed6b2b",
+                                                      "fill": "none",
+                                                      "style": {
+                                                        "height": undefined,
+                                                        "width": undefined,
+                                                      },
+                                                      "viewBox": "0 0 5 5",
+                                                      "xmlns": "http://www.w3.org/2000/svg",
+                                                    },
+                                                    "type": "svg",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                ],
+                                                "props": {
+                                                  "className": "m_89c4f5e4",
+                                                  "data-label-position": "right",
+                                                  "data-size": undefined,
+                                                  "data-variant": undefined,
+                                                  "size": undefined,
+                                                  "style": {},
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": [
+                                                      "foo",
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_8ee546b8",
+                                                      "data-disabled": undefined,
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "htmlFor": "root_option-0",
+                                                      "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_f3f1af94 m_5f75b09e",
+                                          "data-checked": undefined,
+                                          "data-label-position": "right",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "--label-fz": undefined,
+                                            "--label-lh": undefined,
+                                            "--radio-color": "var(--mantine-color-blue-filled)",
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": null,
+                                                    "props": {
+                                                      "autoFocus": false,
+                                                      "checked": false,
+                                                      "className": "m_8a3dbb89",
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "disabled": false,
+                                                      "id": "root_option-1",
+                                                      "name": "root[option]",
+                                                      "onBlur": [Function],
+                                                      "onChange": [Function],
+                                                      "onFocus": [Function],
+                                                      "size": undefined,
+                                                      "style": {},
+                                                      "type": "radio",
+                                                      "value": "1",
+                                                    },
+                                                    "type": "input",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                  {
+                                                    "children": [
+                                                      {
+                                                        "children": null,
+                                                        "props": {
+                                                          "cx": "2.5",
+                                                          "cy": "2.5",
+                                                          "fill": "currentColor",
+                                                          "r": "2.5",
+                                                        },
+                                                        "type": "circle",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                    ],
+                                                    "props": {
+                                                      "aria-hidden": true,
+                                                      "className": "m_f3ed6b2b",
+                                                      "fill": "none",
+                                                      "style": {
+                                                        "height": undefined,
+                                                        "width": undefined,
+                                                      },
+                                                      "viewBox": "0 0 5 5",
+                                                      "xmlns": "http://www.w3.org/2000/svg",
+                                                    },
+                                                    "type": "svg",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                ],
+                                                "props": {
+                                                  "className": "m_89c4f5e4",
+                                                  "data-label-position": "right",
+                                                  "data-size": undefined,
+                                                  "data-variant": undefined,
+                                                  "size": undefined,
+                                                  "style": {},
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": [
+                                                      "bar",
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_8ee546b8",
+                                                      "data-disabled": undefined,
+                                                      "data-size": undefined,
+                                                      "data-variant": undefined,
+                                                      "htmlFor": "root_option-1",
+                                                      "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_f3f1af94 m_5f75b09e",
+                                          "data-checked": undefined,
+                                          "data-label-position": "right",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "--label-fz": undefined,
+                                            "--label-lh": undefined,
+                                            "--radio-color": "var(--mantine-color-blue-filled)",
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                    ],
+                                    "props": {
+                                      "className": "m_8bffd616 __m__-r1bc",
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "size": undefined,
+                                      "style": {
+                                        "flexDirection": "column",
+                                        "flexWrap": "wrap",
+                                        "gap": "var(--mantine-spacing-xs)",
+                                        "marginTop": "var(--mantine-spacing-xs)",
+                                      },
+                                    },
+                                    "type": "div",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "aria-describedby": undefined,
+                                  "aria-labelledby": "root_option-label",
+                                  "role": "radiogroup",
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "aria-describedby": "root_option__error root_option__description root_option__help",
+                              "className": "m_46b77525",
+                              "data-size": undefined,
+                              "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__-r1b5",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1a9{--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": [
+                                  "color",
+                                ],
+                                "props": {
+                                  "className": "m_8fdc1311",
+                                  "data-size": "sm",
+                                  "data-variant": undefined,
+                                  "htmlFor": "root_color",
+                                  "id": "root_color-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-haspopup": "listbox",
+                                      "aria-invalid": false,
+                                      "autoComplete": "off",
+                                      "autoFocus": false,
+                                      "className": "m_8fb7ebe7",
+                                      "data-size": undefined,
+                                      "data-variant": "default",
+                                      "disabled": false,
+                                      "id": "root_color",
+                                      "onBlur": [Function],
+                                      "onChange": [Function],
+                                      "onClick": [Function],
+                                      "onFocus": [Function],
+                                      "onKeyDown": [Function],
+                                      "placeholder": "",
+                                      "readOnly": false,
+                                      "required": false,
+                                      "size": undefined,
+                                      "style": {},
+                                      "value": "",
+                                    },
+                                    "type": "input",
+                                    Symbol(cleaned): true,
+                                  },
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": null,
+                                            "props": {
+                                              "clipRule": "evenodd",
+                                              "d": "M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z",
+                                              "fill": "currentColor",
+                                              "fillRule": "evenodd",
+                                            },
+                                            "type": "path",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "className": "m_2943220b",
+                                          "data-combobox-chevron": true,
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "fill": "none",
+                                          "size": undefined,
+                                          "style": {},
+                                          "viewBox": "0 0 15 15",
+                                          "xmlns": "http://www.w3.org/2000/svg",
+                                        },
+                                        "type": "svg",
+                                        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-pointer-events": "none",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "className": "m_46b77525",
+                              "data-size": "sm",
+                              "data-variant": undefined,
+                              "size": undefined,
+                              "style": {},
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": [
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "red",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1as:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "0",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "green",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1au:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "1",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "blue",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1b0:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "2",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_b1336c6",
+                                                      "style": {},
+                                                    },
+                                                    "type": "div",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                ],
+                                                "props": {
+                                                  "className": "m_c0783ff9",
+                                                  "data-horizontal-hidden": undefined,
+                                                  "data-offset-scrollbars": "y",
+                                                  "data-scrollbars": "xy",
+                                                  "data-size": undefined,
+                                                  "data-variant": undefined,
+                                                  "data-vertical-hidden": undefined,
+                                                  "onScroll": [Function],
+                                                  "size": undefined,
+                                                  "style": {
+                                                    "overflowX": "scroll",
+                                                    "overflowY": "scroll",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": null,
+                                                "props": {
+                                                  "className": "m_c44ba933",
+                                                  "data-hidden": undefined,
+                                                  "data-mantine-scrollbar": true,
+                                                  "data-orientation": "horizontal",
+                                                  "data-state": "hidden",
+                                                  "onLostPointerCapture": [Function],
+                                                  "onMouseEnter": [Function],
+                                                  "onMouseLeave": [Function],
+                                                  "onPointerDown": [Function],
+                                                  "onPointerEnter": [Function],
+                                                  "onPointerLeave": [Function],
+                                                  "onPointerMove": [Function],
+                                                  "onPointerUp": [Function],
+                                                  "style": {
+                                                    "--sa-thumb-width": "18px",
+                                                    "position": "absolute",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": null,
+                                                "props": {
+                                                  "className": "m_c44ba933",
+                                                  "data-hidden": undefined,
+                                                  "data-mantine-scrollbar": true,
+                                                  "data-orientation": "vertical",
+                                                  "data-state": "hidden",
+                                                  "onLostPointerCapture": [Function],
+                                                  "onMouseEnter": [Function],
+                                                  "onMouseLeave": [Function],
+                                                  "onPointerDown": [Function],
+                                                  "onPointerEnter": [Function],
+                                                  "onPointerLeave": [Function],
+                                                  "onPointerMove": [Function],
+                                                  "onPointerUp": [Function],
+                                                  "style": {
+                                                    "--sa-thumb-height": "18px",
+                                                    "position": "absolute",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                            ],
+                                            "props": {
+                                              "className": "m_d57069b5",
+                                              "data-autosize": "true",
+                                              "data-size": undefined,
+                                              "data-variant": undefined,
+                                              "size": undefined,
+                                              "style": {
+                                                "--sa-corner-height": "0px",
+                                                "--sa-corner-width": "0px",
+                                                "--scrollarea-scrollbar-size": "var(--combobox-padding)",
+                                              },
+                                            },
+                                            "type": "div",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "className": "",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "display": "flex",
+                                            "flex": 1,
+                                            "flexDirection": "column",
+                                            "minHeight": 0,
+                                            "minWidth": 0,
+                                            "overflow": "hidden",
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                    ],
+                                    "props": {
+                                      "className": "",
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "size": undefined,
+                                      "style": {
+                                        "display": "flex",
+                                        "maxHeight": "calc(13.75rem * var(--mantine-scale))",
+                                        "overflow": "hidden",
+                                      },
+                                    },
+                                    "type": "div",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "aria-labelledby": "root_color-label",
+                                  "className": "m_b2821a6e",
+                                  "data-size": undefined,
+                                  "data-variant": undefined,
+                                  "id": "",
+                                  "onMouseDown": [Function],
+                                  "role": "listbox",
+                                  "size": undefined,
+                                  "style": {
+                                    "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                                    "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "className": "m_38a85659 m_88b62a41",
+                              "data-composed": true,
+                              "data-fixed": undefined,
+                              "data-position": "bottom",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "onKeyDownCapture": [Function],
+                              "role": "presentation",
+                              "size": undefined,
+                              "style": {
+                                "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                                "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                                "display": "none",
+                                "left": 0,
+                                "top": 0,
+                                "width": undefined,
+                                "zIndex": 300,
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                          {
+                            "children": null,
+                            "props": {
+                              "disabled": false,
+                              "form": undefined,
+                              "name": "root[color]",
+                              "type": "hidden",
+                              "value": "",
+                            },
+                            "type": "input",
+                            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__-r1a9",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r14o{--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": [
+                                  "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,
+                  },
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": null,
+                                        "props": {
+                                          "aria-describedby": "root_active__error root_active__description root_active__help",
+                                          "autoFocus": false,
+                                          "checked": false,
+                                          "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": undefined,
+                              "data-label-position": "right",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "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,
+                  },
+                ],
+                "props": {
+                  "className": "m_2415a157 __m__-r14o",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1cq{--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": [
+                                  "description",
+                                ],
+                                "props": {
+                                  "className": "m_8fdc1311",
+                                  "data-size": "sm",
+                                  "data-variant": undefined,
+                                  "htmlFor": "root_description",
+                                  "id": "root_description-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_description",
+                                      "name": "root[description]",
+                                      "onBlur": [Function],
+                                      "onChange": [Function],
+                                      "onFocus": [Function],
+                                      "required": false,
+                                      "size": undefined,
+                                      "style": {
+                                        "--input-resize": undefined,
+                                      },
+                                      "value": "",
+                                    },
+                                    "type": "textarea",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "className": "m_6c018570",
+                                  "data-multiline": true,
+                                  "data-size": "sm",
+                                  "data-variant": "default",
+                                  "size": undefined,
+                                  "style": {
+                                    "--input-fz": "var(--mantine-font-size-sm)",
+                                    "--input-height": "var(--input-height-sm)",
+                                    "--input-padding-y": "var(--input-padding-y-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__-r1cq",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1gi{--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": [
+                                      "tasks",
+                                    ],
+                                    "props": {
+                                      "className": "m_8a5d1357",
+                                      "data-order": 4,
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "id": "root_tasks__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": [
+                                                          "tasks-1",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8a5d1357",
+                                                          "data-order": 3,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": "root_tasks_0__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__-r1gu{--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": [
+                                                                          "title",
+                                                                        ],
+                                                                        "props": {
+                                                                          "className": "m_8fdc1311",
+                                                                          "data-size": "sm",
+                                                                          "data-variant": undefined,
+                                                                          "htmlFor": "root_tasks_0_title",
+                                                                          "id": "root_tasks_0_title-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_tasks_0_title",
+                                                                              "name": "root.tasks.0.title",
+                                                                              "onBlur": [Function],
+                                                                              "onChange": [Function],
+                                                                              "onFocus": [Function],
+                                                                              "placeholder": "",
+                                                                              "required": false,
+                                                                              "size": undefined,
+                                                                              "style": {},
+                                                                              "type": "text",
+                                                                              "value": "Task 1",
+                                                                            },
+                                                                            "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": [
+                                                                              {
+                                                                                "children": null,
+                                                                                "props": {
+                                                                                  "aria-describedby": "root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help",
+                                                                                  "autoFocus": false,
+                                                                                  "checked": false,
+                                                                                  "className": "m_26063560",
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "disabled": false,
+                                                                                  "id": "root_tasks_0_done",
+                                                                                  "name": "root.tasks.0.done",
+                                                                                  "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": [
+                                                                                  "done",
+                                                                                ],
+                                                                                "props": {
+                                                                                  "className": "m_8ee546b8",
+                                                                                  "data-disabled": undefined,
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "htmlFor": "root_tasks_0_done",
+                                                                                  "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": undefined,
+                                                                      "data-label-position": "right",
+                                                                      "data-size": undefined,
+                                                                      "data-variant": undefined,
+                                                                      "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,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_2415a157 __m__-r1gu",
+                                                          "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_tasks_0",
+                                                      "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": {
+                                                "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_tasks_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_tasks_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_tasks_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__-r1gp",
+                                          "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": [
+                                                          "tasks-2",
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_8a5d1357",
+                                                          "data-order": 3,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": "root_tasks_1__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__-r1hq{--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": [
+                                                                          "title",
+                                                                        ],
+                                                                        "props": {
+                                                                          "className": "m_8fdc1311",
+                                                                          "data-size": "sm",
+                                                                          "data-variant": undefined,
+                                                                          "htmlFor": "root_tasks_1_title",
+                                                                          "id": "root_tasks_1_title-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_tasks_1_title",
+                                                                              "name": "root.tasks.1.title",
+                                                                              "onBlur": [Function],
+                                                                              "onChange": [Function],
+                                                                              "onFocus": [Function],
+                                                                              "placeholder": "",
+                                                                              "required": false,
+                                                                              "size": undefined,
+                                                                              "style": {},
+                                                                              "type": "text",
+                                                                              "value": "Task 2",
+                                                                            },
+                                                                            "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": [
+                                                                              {
+                                                                                "children": null,
+                                                                                "props": {
+                                                                                  "aria-describedby": "root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help",
+                                                                                  "autoFocus": false,
+                                                                                  "checked": true,
+                                                                                  "className": "m_26063560",
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "disabled": false,
+                                                                                  "id": "root_tasks_1_done",
+                                                                                  "name": "root.tasks.1.done",
+                                                                                  "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": [
+                                                                                  "done",
+                                                                                ],
+                                                                                "props": {
+                                                                                  "className": "m_8ee546b8",
+                                                                                  "data-disabled": undefined,
+                                                                                  "data-size": undefined,
+                                                                                  "data-variant": undefined,
+                                                                                  "htmlFor": "root_tasks_1_done",
+                                                                                  "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": undefined,
+                                                                      "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,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "className": "m_2415a157 __m__-r1hq",
+                                                          "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_tasks_1",
+                                                      "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": {
+                                                "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_tasks_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_tasks_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_tasks_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__-r1hl",
+                                          "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_tasks__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-object m_e9408a47",
+                              "data-size": undefined,
+                              "data-variant": "default",
+                              "id": "root_tasks",
+                              "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__-r1gi",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1f6{--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": [
+                                      "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": "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": "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__-r1fd",
+                                          "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": "bar",
+                                                            },
+                                                            "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__-r1ft",
+                                          "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__-r1f6",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1dv{--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__-r1e4{--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_person_firstName",
+                                                  "id": "root_person_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_person_firstName",
+                                                      "name": "root.person.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_person_lastName",
+                                                  "id": "root_person_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_person_lastName",
+                                                      "name": "root.person.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": [
+                                                  "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__-r1el{--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__-r1el",
+                                                  "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__-r1e4",
+                                  "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__-r1dv",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1im{--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": [
+                                  "color",
+                                ],
+                                "props": {
+                                  "className": "m_8fdc1311",
+                                  "data-size": "sm",
+                                  "data-variant": undefined,
+                                  "htmlFor": "root_color",
+                                  "id": "root_color-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-haspopup": "listbox",
+                                      "aria-invalid": false,
+                                      "autoComplete": "off",
+                                      "autoFocus": false,
+                                      "className": "m_8fb7ebe7",
+                                      "data-size": undefined,
+                                      "data-variant": "default",
+                                      "disabled": false,
+                                      "id": "root_color",
+                                      "onBlur": [Function],
+                                      "onChange": [Function],
+                                      "onClick": [Function],
+                                      "onFocus": [Function],
+                                      "onKeyDown": [Function],
+                                      "placeholder": "",
+                                      "readOnly": false,
+                                      "required": false,
+                                      "size": undefined,
+                                      "style": {},
+                                      "value": "",
+                                    },
+                                    "type": "input",
+                                    Symbol(cleaned): true,
+                                  },
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": null,
+                                            "props": {
+                                              "clipRule": "evenodd",
+                                              "d": "M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z",
+                                              "fill": "currentColor",
+                                              "fillRule": "evenodd",
+                                            },
+                                            "type": "path",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "className": "m_2943220b",
+                                          "data-combobox-chevron": true,
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "fill": "none",
+                                          "size": undefined,
+                                          "style": {},
+                                          "viewBox": "0 0 15 15",
+                                          "xmlns": "http://www.w3.org/2000/svg",
+                                        },
+                                        "type": "svg",
+                                        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-pointer-events": "none",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "className": "m_46b77525",
+                              "data-size": "sm",
+                              "data-variant": undefined,
+                              "size": undefined,
+                              "style": {},
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": [
+                                          {
+                                            "children": [
+                                              {
+                                                "children": [
+                                                  {
+                                                    "children": [
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "red",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1j9:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "0",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "green",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1jb:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "1",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                      {
+                                                        "children": [
+                                                          {
+                                                            "children": [
+                                                              "blue",
+                                                            ],
+                                                            "props": {},
+                                                            "type": "span",
+                                                            Symbol(cleaned): true,
+                                                          },
+                                                        ],
+                                                        "props": {
+                                                          "aria-selected": false,
+                                                          "className": "m_92253aa5 m_390b5f4",
+                                                          "data-combobox-option": true,
+                                                          "data-size": undefined,
+                                                          "data-variant": undefined,
+                                                          "id": ":r1jd:",
+                                                          "onClick": [Function],
+                                                          "onMouseDown": [Function],
+                                                          "onMouseOver": [Function],
+                                                          "role": "option",
+                                                          "size": undefined,
+                                                          "style": {},
+                                                          "value": "2",
+                                                        },
+                                                        "type": "div",
+                                                        Symbol(cleaned): true,
+                                                      },
+                                                    ],
+                                                    "props": {
+                                                      "className": "m_b1336c6",
+                                                      "style": {},
+                                                    },
+                                                    "type": "div",
+                                                    Symbol(cleaned): true,
+                                                  },
+                                                ],
+                                                "props": {
+                                                  "className": "m_c0783ff9",
+                                                  "data-horizontal-hidden": undefined,
+                                                  "data-offset-scrollbars": "y",
+                                                  "data-scrollbars": "xy",
+                                                  "data-size": undefined,
+                                                  "data-variant": undefined,
+                                                  "data-vertical-hidden": undefined,
+                                                  "onScroll": [Function],
+                                                  "size": undefined,
+                                                  "style": {
+                                                    "overflowX": "scroll",
+                                                    "overflowY": "scroll",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": null,
+                                                "props": {
+                                                  "className": "m_c44ba933",
+                                                  "data-hidden": undefined,
+                                                  "data-mantine-scrollbar": true,
+                                                  "data-orientation": "horizontal",
+                                                  "data-state": "hidden",
+                                                  "onLostPointerCapture": [Function],
+                                                  "onMouseEnter": [Function],
+                                                  "onMouseLeave": [Function],
+                                                  "onPointerDown": [Function],
+                                                  "onPointerEnter": [Function],
+                                                  "onPointerLeave": [Function],
+                                                  "onPointerMove": [Function],
+                                                  "onPointerUp": [Function],
+                                                  "style": {
+                                                    "--sa-thumb-width": "18px",
+                                                    "position": "absolute",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                              {
+                                                "children": null,
+                                                "props": {
+                                                  "className": "m_c44ba933",
+                                                  "data-hidden": undefined,
+                                                  "data-mantine-scrollbar": true,
+                                                  "data-orientation": "vertical",
+                                                  "data-state": "hidden",
+                                                  "onLostPointerCapture": [Function],
+                                                  "onMouseEnter": [Function],
+                                                  "onMouseLeave": [Function],
+                                                  "onPointerDown": [Function],
+                                                  "onPointerEnter": [Function],
+                                                  "onPointerLeave": [Function],
+                                                  "onPointerMove": [Function],
+                                                  "onPointerUp": [Function],
+                                                  "style": {
+                                                    "--sa-thumb-height": "18px",
+                                                    "position": "absolute",
+                                                  },
+                                                },
+                                                "type": "div",
+                                                Symbol(cleaned): true,
+                                              },
+                                            ],
+                                            "props": {
+                                              "className": "m_d57069b5",
+                                              "data-autosize": "true",
+                                              "data-size": undefined,
+                                              "data-variant": undefined,
+                                              "size": undefined,
+                                              "style": {
+                                                "--sa-corner-height": "0px",
+                                                "--sa-corner-width": "0px",
+                                                "--scrollarea-scrollbar-size": "var(--combobox-padding)",
+                                              },
+                                            },
+                                            "type": "div",
+                                            Symbol(cleaned): true,
+                                          },
+                                        ],
+                                        "props": {
+                                          "className": "",
+                                          "data-size": undefined,
+                                          "data-variant": undefined,
+                                          "size": undefined,
+                                          "style": {
+                                            "display": "flex",
+                                            "flex": 1,
+                                            "flexDirection": "column",
+                                            "minHeight": 0,
+                                            "minWidth": 0,
+                                            "overflow": "hidden",
+                                          },
+                                        },
+                                        "type": "div",
+                                        Symbol(cleaned): true,
+                                      },
+                                    ],
+                                    "props": {
+                                      "className": "",
+                                      "data-size": undefined,
+                                      "data-variant": undefined,
+                                      "size": undefined,
+                                      "style": {
+                                        "display": "flex",
+                                        "maxHeight": "calc(13.75rem * var(--mantine-scale))",
+                                        "overflow": "hidden",
+                                      },
+                                    },
+                                    "type": "div",
+                                    Symbol(cleaned): true,
+                                  },
+                                ],
+                                "props": {
+                                  "aria-labelledby": "root_color-label",
+                                  "className": "m_b2821a6e",
+                                  "data-size": undefined,
+                                  "data-variant": undefined,
+                                  "id": "",
+                                  "onMouseDown": [Function],
+                                  "role": "listbox",
+                                  "size": undefined,
+                                  "style": {
+                                    "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                                    "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                                  },
+                                },
+                                "type": "div",
+                                Symbol(cleaned): true,
+                              },
+                            ],
+                            "props": {
+                              "className": "m_38a85659 m_88b62a41",
+                              "data-composed": true,
+                              "data-fixed": undefined,
+                              "data-position": "bottom",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "onKeyDownCapture": [Function],
+                              "role": "presentation",
+                              "size": undefined,
+                              "style": {
+                                "--combobox-option-fz": "var(--mantine-font-size-sm)",
+                                "--combobox-option-padding": "var(--combobox-option-padding-sm)",
+                                "display": "none",
+                                "left": 0,
+                                "top": 0,
+                                "width": undefined,
+                                "zIndex": 300,
+                              },
+                            },
+                            "type": "div",
+                            Symbol(cleaned): true,
+                          },
+                          {
+                            "children": null,
+                            "props": {
+                              "disabled": false,
+                              "form": undefined,
+                              "name": "root.color",
+                              "type": "hidden",
+                              "value": "",
+                            },
+                            "type": "input",
+                            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__-r1im",
+                  "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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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__-r1d5{--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": [
+                                  "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,
+                  },
+                  {
+                    "children": [
+                      {
+                        "children": [
+                          {
+                            "children": [
+                              {
+                                "children": [
+                                  {
+                                    "children": [
+                                      {
+                                        "children": null,
+                                        "props": {
+                                          "aria-describedby": "root_active__error root_active__description root_active__help",
+                                          "autoFocus": false,
+                                          "checked": false,
+                                          "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": undefined,
+                              "data-label-position": "right",
+                              "data-size": undefined,
+                              "data-variant": undefined,
+                              "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,
+                  },
+                ],
+                "props": {
+                  "className": "m_2415a157 __m__-r1d5",
+                  "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,
+  },
+]
+`;
+
 exports[`single fields checkbox field 1`] = `
 [
   <style
diff --git a/packages/mantine/test/__snapshots__/Object.test.tsx.snap b/packages/mantine/test/__snapshots__/Object.test.tsx.snap
index 5868119b3a..3891923756 100644
--- a/packages/mantine/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/mantine/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,6144 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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": undefined,
+                              "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,
+  },
+]
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+[
+  <style
+    dangerouslySetInnerHTML={
+      {
+        "__html": "
+
+
+
+",
+      }
+    }
+    data-mantine-styles={true}
+  />,
+  <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,
+  },
+]
+`;
+
 exports[`object fields additionalProperties 1`] = `
 [
   <style
diff --git a/packages/mui/test/__snapshots__/Array.test.tsx.snap b/packages/mui/test/__snapshots__/Array.test.tsx.snap
index 6be390de37..fa27a92cd4 100644
--- a/packages/mui/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/mui/test/__snapshots__/Array.test.tsx.snap
@@ -4674,6 +4674,8706 @@ label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-p
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-10 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-12 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-13 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(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-13.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-14 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-14.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-14:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-14:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-14.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-14.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-14.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-14.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-15 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-15::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15:focus {
+  outline: 0;
+}
+
+.emotion-15:invalid {
+  box-shadow: none;
+}
+
+.emotion-15::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-15.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-15:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-15:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-16 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-17 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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-17>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-26 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-27.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-28 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-31 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-31::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-31.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-31 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-31:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-31:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-31.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-31.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-63 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-63>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-63>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-63>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-65 {
+  margin-top: 16px;
+}
+
+.emotion-66 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-66::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-66.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-66 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-66:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-66:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-66.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-66.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-67 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-68 {
+  margin-top: 24px;
+}
+
+.emotion-69 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-69::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-69.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-69 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-69:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-69.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-69:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-69:hover {
+    box-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);
+  }
+}
+
+.emotion-69:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-69.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-69.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-69:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-69.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-9"
+                          style={
+                            {
+                              "marginTop": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <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-13"
+                                    data-shrink={true}
+                                    htmlFor="root_0_name"
+                                    id="root_0_name-label"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_0_name"
+                                      name="root[0][name]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          name
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <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-13"
+                                    data-shrink={true}
+                                    htmlFor="root_0_value"
+                                    id="root_0_value-label"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_0_value"
+                                      name="root[0][value]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          value
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <button
+                className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-27"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-28"
+                  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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-27"
+                disabled={null}
+                id="root_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-28"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-31"
+                disabled={null}
+                id="root_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-28"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-9"
+                          style={
+                            {
+                              "marginTop": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <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-13"
+                                    data-shrink={true}
+                                    htmlFor="root_1_name"
+                                    id="root_1_name-label"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_1_name"
+                                      name="root[1][name]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          name
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <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-13"
+                                    data-shrink={true}
+                                    htmlFor="root_1_value"
+                                    id="root_1_value-label"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_1_value"
+                                      name="root[1][value]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          value
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <button
+                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-27"
+                disabled={null}
+                id="root_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-28"
+                  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-27"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-28"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-31"
+                disabled={null}
+                id="root_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-28"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-63"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <div
+                className="MuiBox-root emotion-65"
+              >
+                <button
+                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-66"
+                  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-67"
+                    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>
+  </div>
+  <div
+    className="MuiBox-root emotion-68"
+  >
+    <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-69"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-9 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-10 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-10.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-10:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-10:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-10.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-10.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-11 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-11::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11:focus {
+  outline: 0;
+}
+
+.emotion-11:invalid {
+  box-shadow: none;
+}
+
+.emotion-11::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-11.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-11:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-12 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-13 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  padding: 0;
+  line-height: 11px;
+  -webkit-transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+  transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+}
+
+.emotion-14 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-15 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-15::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-15.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-15 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-15:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-15:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-15.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-15.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-16 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-19 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-19::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-19.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-19 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-19:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-19:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-19.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-19.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-39 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-39>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-39>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-39>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-41 {
+  margin-top: 16px;
+}
+
+.emotion-42 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-42::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-42.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-42 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-42:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-42:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-42.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-42.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-43 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-44 {
+  margin-top: 24px;
+}
+
+.emotion-45 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-45::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-45.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-45 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-45:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-45.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-45:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-45:hover {
+    box-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);
+  }
+}
+
+.emotion-45:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-45.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-45.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-45:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-45.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_0"
+                              name="root[0]"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="foo"
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <button
+                className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-15"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-16"
+                  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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-15"
+                disabled={null}
+                id="root_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-16"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-19"
+                disabled={null}
+                id="root_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-16"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_1"
+                              name="root[1]"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="bar"
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <button
+                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-15"
+                disabled={null}
+                id="root_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-16"
+                  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-15"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-16"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-19"
+                disabled={null}
+                id="root_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-16"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-39"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <div
+                className="MuiBox-root emotion-41"
+              >
+                <button
+                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-42"
+                  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-43"
+                    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>
+  </div>
+  <div
+    className="MuiBox-root emotion-44"
+  >
+    <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-45"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-2 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-2.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-2:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-2:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-2.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-2.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-2.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-2.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-3 {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  border-radius: 0;
+  cursor: pointer;
+  border-radius: 4px;
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-3:focus {
+  border-radius: 0;
+}
+
+.emotion-3.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-3[multiple] {
+  height: auto;
+}
+
+.emotion-3:not([multiple]) option,
+.emotion-3:not([multiple]) optgroup {
+  background-color: #fff;
+}
+
+.emotion-3:focus {
+  border-radius: 4px;
+}
+
+.emotion-3.emotion-3.emotion-3 {
+  padding-right: 32px;
+}
+
+.emotion-3.MuiSelect-select {
+  height: auto;
+  min-height: 1.4375em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.emotion-3::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-3::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-3::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-3:focus {
+  outline: 0;
+}
+
+.emotion-3:invalid {
+  box-shadow: none;
+}
+
+.emotion-3::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-3:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-3.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-3:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-3:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-4 {
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  opacity: 0;
+  pointer-events: none;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+  position: absolute;
+  right: 0;
+  top: calc(50% - .5em);
+  pointer-events: none;
+  color: rgba(0, 0, 0, 0.54);
+  right: 7px;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-6 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-7 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  padding: 0;
+  line-height: 11px;
+  -webkit-transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+  transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+}
+
+.emotion-8 {
+  margin-top: 24px;
+}
+
+.emotion-9 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-9::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-9.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-9 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-9:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-9.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-9:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-9:hover {
+    box-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);
+  }
+}
+
+.emotion-9:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-9.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-9.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-9:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-9.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        aria-describedby="root__error root__description root__help"
+        className="MuiFormControl-root MuiTextField-root emotion-1"
+      >
+        <div
+          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl MuiSelect-root emotion-2"
+          onClick={[Function]}
+        >
+          <div
+            aria-expanded="false"
+            aria-haspopup="listbox"
+            aria-labelledby="root"
+            className="MuiSelect-select MuiSelect-outlined MuiSelect-multiple MuiInputBase-input MuiOutlinedInput-input emotion-3"
+            id="root"
+            onBlur={[Function]}
+            onFocus={[Function]}
+            onKeyDown={[Function]}
+            onMouseDown={[Function]}
+            role="combobox"
+            tabIndex={0}
+          >
+            <span
+              aria-hidden={true}
+              className="notranslate"
+            >
+              ​
+            </span>
+          </div>
+          <input
+            aria-hidden={true}
+            aria-invalid={false}
+            autoFocus={false}
+            className="MuiSelect-nativeInput emotion-4"
+            disabled={false}
+            name="root"
+            onAnimationStart={[Function]}
+            onChange={[Function]}
+            required={false}
+            tabIndex={-1}
+            value=""
+          />
+          <svg
+            aria-hidden={true}
+            className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSelect-icon MuiSelect-iconOutlined emotion-5"
+            data-testid="ArrowDropDownIcon"
+            focusable="false"
+            viewBox="0 0 24 24"
+          >
+            <path
+              d="M7 10l5 5 5-5z"
+            />
+          </svg>
+          <fieldset
+            aria-hidden={true}
+            className="MuiOutlinedInput-notchedOutline emotion-6"
+          >
+            <legend
+              className="emotion-7"
+            >
+              <span
+                aria-hidden={true}
+                className="notranslate"
+              >
+                ​
+              </span>
+            </legend>
+          </fieldset>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-8"
+  >
+    <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-9"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-9 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-10 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-10.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-10:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-10:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-10.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-10.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-11 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-11::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11:focus {
+  outline: 0;
+}
+
+.emotion-11:invalid {
+  box-shadow: none;
+}
+
+.emotion-11::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-11.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-11:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-12 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-13 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  padding: 0;
+  line-height: 11px;
+  -webkit-transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+  transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+}
+
+.emotion-31 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-31.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-31 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-32 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-32::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-32.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-32 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-32:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-32.Mui-checked,
+.emotion-32.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-32.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-32:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-33 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-34 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-35 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-36 {
+  margin-top: 24px;
+}
+
+.emotion-37 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-37::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-37.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-37 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-37:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-37.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-37:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-37:hover {
+    box-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);
+  }
+}
+
+.emotion-37:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-37.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-37.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-37:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-37.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_0"
+                              name="root[0]"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="text"
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_1"
+                              name="root[1]"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              step="any"
+                              type="number"
+                              value={42}
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <label
+                          className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-31"
+                        >
+                          <span
+                            aria-describedby="root_2__error root_2__description root_2__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-32"
+                            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}
+                          >
+                            <input
+                              autoFocus={false}
+                              checked={true}
+                              className="PrivateSwitchBase-input emotion-33"
+                              data-indeterminate={false}
+                              disabled={false}
+                              id="root_2"
+                              name="root[2]"
+                              onChange={[Function]}
+                              required={false}
+                              type="checkbox"
+                            />
+                            <svg
+                              aria-hidden={true}
+                              className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-34"
+                              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
+                            className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-35"
+                            style={{}}
+                          />
+                        </label>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-36"
+  >
+    <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-37"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-17 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-18 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-18.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-18:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-18:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-18.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-18.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-19 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-19::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19:focus {
+  outline: 0;
+}
+
+.emotion-19:invalid {
+  box-shadow: none;
+}
+
+.emotion-19::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-19.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-19:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-19:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-20 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-21 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  padding: 0;
+  line-height: 11px;
+  -webkit-transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+  transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+}
+
+.emotion-22 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-23 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-23::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-23.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-23 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-23:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-23:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-23.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-23.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-24 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-27.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-47 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-47>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-47>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-47>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-49 {
+  margin-top: 16px;
+}
+
+.emotion-50 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-50::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-50.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-50 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-50:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-50:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-50.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-50.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-51 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-120 {
+  margin-top: 24px;
+}
+
+.emotion-121 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-121::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-121.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-121 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-121:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-121.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-121:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-121:hover {
+    box-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);
+  }
+}
+
+.emotion-121:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-121.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-121.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-121:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-121.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                          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-2"
+                          >
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+                                style={
+                                  {
+                                    "overflow": "auto",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiBox-root emotion-5"
+                                >
+                                  <div
+                                    className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                                    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-2"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                        >
+                                          <div
+                                            aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                            className="MuiFormControl-root MuiTextField-root emotion-17"
+                                          >
+                                            <div
+                                              className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                              onClick={[Function]}
+                                            >
+                                              <input
+                                                aria-invalid={false}
+                                                autoFocus={false}
+                                                className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                                disabled={false}
+                                                id="root_0_0"
+                                                name="root[0][0]"
+                                                onAnimationStart={[Function]}
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                required={true}
+                                                type="text"
+                                                value="a"
+                                              />
+                                              <fieldset
+                                                aria-hidden={true}
+                                                className="MuiOutlinedInput-notchedOutline emotion-20"
+                                              >
+                                                <legend
+                                                  className="emotion-21"
+                                                >
+                                                  <span
+                                                    aria-hidden={true}
+                                                    className="notranslate"
+                                                  >
+                                                    ​
+                                                  </span>
+                                                </legend>
+                                              </fieldset>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <button
+                                  className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                                  disabled={true}
+                                  id="root_0_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"
+                                >
+                                  <svg
+                                    aria-hidden={true}
+                                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                                    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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-23"
+                                  disabled={null}
+                                  id="root_0_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-24"
+                                    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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                                  disabled={null}
+                                  id="root_0_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-24"
+                                    data-testid="RemoveIcon"
+                                    focusable="false"
+                                    viewBox="0 0 24 24"
+                                  >
+                                    <path
+                                      d="M19 13H5v-2h14z"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </div>
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+                                style={
+                                  {
+                                    "overflow": "auto",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiBox-root emotion-5"
+                                >
+                                  <div
+                                    className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                                    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-2"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                        >
+                                          <div
+                                            aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                            className="MuiFormControl-root MuiTextField-root emotion-17"
+                                          >
+                                            <div
+                                              className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                              onClick={[Function]}
+                                            >
+                                              <input
+                                                aria-invalid={false}
+                                                autoFocus={false}
+                                                className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                                disabled={false}
+                                                id="root_0_1"
+                                                name="root[0][1]"
+                                                onAnimationStart={[Function]}
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                required={true}
+                                                type="text"
+                                                value="b"
+                                              />
+                                              <fieldset
+                                                aria-hidden={true}
+                                                className="MuiOutlinedInput-notchedOutline emotion-20"
+                                              >
+                                                <legend
+                                                  className="emotion-21"
+                                                >
+                                                  <span
+                                                    aria-hidden={true}
+                                                    className="notranslate"
+                                                  >
+                                                    ​
+                                                  </span>
+                                                </legend>
+                                              </fieldset>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <button
+                                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                                  disabled={null}
+                                  id="root_0_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-24"
+                                    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-23"
+                                  disabled={true}
+                                  id="root_0_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"
+                                >
+                                  <svg
+                                    aria-hidden={true}
+                                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                                    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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                                  disabled={null}
+                                  id="root_0_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-24"
+                                    data-testid="RemoveIcon"
+                                    focusable="false"
+                                    viewBox="0 0 24 24"
+                                  >
+                                    <path
+                                      d="M19 13H5v-2h14z"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </div>
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-47"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-49"
+                                >
+                                  <button
+                                    className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-50"
+                                    disabled={null}
+                                    id="root_0__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-51"
+                                      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>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+            >
+              <button
+                className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                  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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-23"
+                disabled={null}
+                id="root_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-24"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                disabled={null}
+                id="root_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-24"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                          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-2"
+                          >
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+                                style={
+                                  {
+                                    "overflow": "auto",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiBox-root emotion-5"
+                                >
+                                  <div
+                                    className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                                    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-2"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                        >
+                                          <div
+                                            aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                            className="MuiFormControl-root MuiTextField-root emotion-17"
+                                          >
+                                            <div
+                                              className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                              onClick={[Function]}
+                                            >
+                                              <input
+                                                aria-invalid={false}
+                                                autoFocus={false}
+                                                className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                                disabled={false}
+                                                id="root_1_0"
+                                                name="root[1][0]"
+                                                onAnimationStart={[Function]}
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                required={true}
+                                                type="text"
+                                                value="c"
+                                              />
+                                              <fieldset
+                                                aria-hidden={true}
+                                                className="MuiOutlinedInput-notchedOutline emotion-20"
+                                              >
+                                                <legend
+                                                  className="emotion-21"
+                                                >
+                                                  <span
+                                                    aria-hidden={true}
+                                                    className="notranslate"
+                                                  >
+                                                    ​
+                                                  </span>
+                                                </legend>
+                                              </fieldset>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <button
+                                  className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                                  disabled={true}
+                                  id="root_1_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"
+                                >
+                                  <svg
+                                    aria-hidden={true}
+                                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                                    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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-23"
+                                  disabled={null}
+                                  id="root_1_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-24"
+                                    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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                                  disabled={null}
+                                  id="root_1_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-24"
+                                    data-testid="RemoveIcon"
+                                    focusable="false"
+                                    viewBox="0 0 24 24"
+                                  >
+                                    <path
+                                      d="M19 13H5v-2h14z"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </div>
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+                                style={
+                                  {
+                                    "overflow": "auto",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="MuiBox-root emotion-5"
+                                >
+                                  <div
+                                    className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                                    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-2"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div
+                                          className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                        >
+                                          <div
+                                            aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                            className="MuiFormControl-root MuiTextField-root emotion-17"
+                                          >
+                                            <div
+                                              className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                              onClick={[Function]}
+                                            >
+                                              <input
+                                                aria-invalid={false}
+                                                autoFocus={false}
+                                                className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                                disabled={false}
+                                                id="root_1_1"
+                                                name="root[1][1]"
+                                                onAnimationStart={[Function]}
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                required={true}
+                                                type="text"
+                                                value="d"
+                                              />
+                                              <fieldset
+                                                aria-hidden={true}
+                                                className="MuiOutlinedInput-notchedOutline emotion-20"
+                                              >
+                                                <legend
+                                                  className="emotion-21"
+                                                >
+                                                  <span
+                                                    aria-hidden={true}
+                                                    className="notranslate"
+                                                  >
+                                                    ​
+                                                  </span>
+                                                </legend>
+                                              </fieldset>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <button
+                                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                                  disabled={null}
+                                  id="root_1_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-24"
+                                    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-23"
+                                  disabled={true}
+                                  id="root_1_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"
+                                >
+                                  <svg
+                                    aria-hidden={true}
+                                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                                    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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                                  disabled={null}
+                                  id="root_1_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-24"
+                                    data-testid="RemoveIcon"
+                                    focusable="false"
+                                    viewBox="0 0 24 24"
+                                  >
+                                    <path
+                                      d="M19 13H5v-2h14z"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </div>
+                            <div
+                              className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-47"
+                            >
+                              <div
+                                className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-49"
+                                >
+                                  <button
+                                    className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-50"
+                                    disabled={null}
+                                    id="root_1__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-51"
+                                      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>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+            >
+              <button
+                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                disabled={null}
+                id="root_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-24"
+                  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-23"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                disabled={null}
+                id="root_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-24"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-47"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+            >
+              <div
+                className="MuiBox-root emotion-49"
+              >
+                <button
+                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-50"
+                  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-51"
+                    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>
+  </div>
+  <div
+    className="MuiBox-root emotion-120"
+  >
+    <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-121"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-10 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-12 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-13 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-13.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-14 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-14.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-14:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-14:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-14.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-14.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-14.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-14.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-15 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-15::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-15:focus {
+  outline: 0;
+}
+
+.emotion-15:invalid {
+  box-shadow: none;
+}
+
+.emotion-15::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-15:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-15.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-15:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-15:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-16 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-17 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-17>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-26 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-27.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-28 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-31 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-31::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-31.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-31 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-31:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-31:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-31.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-31.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-63 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-63>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-63>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-63>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-65 {
+  margin-top: 16px;
+}
+
+.emotion-66 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-66::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-66.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-66 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-66:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-66:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-66.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-66.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-67 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-68 {
+  margin-top: 24px;
+}
+
+.emotion-69 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-69::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-69.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-69 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-69:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-69.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-69:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-69:hover {
+    box-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);
+  }
+}
+
+.emotion-69:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-69.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-69.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-69:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-69.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-9"
+                          style={
+                            {
+                              "marginTop": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <label
+                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-13"
+                                    data-shrink={false}
+                                    htmlFor="root_0_name"
+                                    id="root_0_name-label"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_0_name"
+                                      name="root.0.name"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          name
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <label
+                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-13"
+                                    data-shrink={false}
+                                    htmlFor="root_0_value"
+                                    id="root_0_value-label"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_0_value"
+                                      name="root.0.value"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          value
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <button
+                className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-27"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-28"
+                  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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-27"
+                disabled={null}
+                id="root_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-28"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-31"
+                disabled={null}
+                id="root_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-28"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-9"
+                          style={
+                            {
+                              "marginTop": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <label
+                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-13"
+                                    data-shrink={false}
+                                    htmlFor="root_1_name"
+                                    id="root_1_name-label"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_1_name"
+                                      name="root.1.name"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          name
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-10"
+                            style={
+                              {
+                                "marginBottom": "10px",
+                              }
+                            }
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-number"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-12"
+                                >
+                                  <label
+                                    className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-13"
+                                    data-shrink={false}
+                                    htmlFor="root_1_value"
+                                    id="root_1_value-label"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-14"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-15"
+                                      disabled={false}
+                                      id="root_1_value"
+                                      name="root.1.value"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-16"
+                                    >
+                                      <legend
+                                        className="emotion-17"
+                                      >
+                                        <span>
+                                          value
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <button
+                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-27"
+                disabled={null}
+                id="root_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-28"
+                  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-27"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-28"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-31"
+                disabled={null}
+                id="root_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-28"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-63"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-26"
+            >
+              <div
+                className="MuiBox-root emotion-65"
+              >
+                <button
+                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-66"
+                  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-67"
+                    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>
+  </div>
+  <div
+    className="MuiBox-root emotion-68"
+  >
+    <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-69"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-2 {
+  padding: 16px;
+}
+
+.emotion-3 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-3>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-3>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-3>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-4 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-5 {
+  margin-bottom: 16px;
+}
+
+.emotion-9 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-10 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-10.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-10:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-10:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-10.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-10.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-10.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-11 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-11::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-11:focus {
+  outline: 0;
+}
+
+.emotion-11:invalid {
+  box-shadow: none;
+}
+
+.emotion-11::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-11:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-11.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-11:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-12 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-13 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  padding: 0;
+  line-height: 11px;
+  -webkit-transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+  transition: width 150ms cubic-bezier(0.0, 0, 0.2, 1) 0ms;
+}
+
+.emotion-14 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-15 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-15::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-15.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-15 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-15:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-15:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-15.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-15.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-16 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-19 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-19::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-19.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-19 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-19:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-19:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-19.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-19.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-39 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-39>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-39>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-39>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-41 {
+  margin-top: 16px;
+}
+
+.emotion-42 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-42::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-42.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-42 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-42:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-42:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-42.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-42.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-43 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-44 {
+  margin-top: 24px;
+}
+
+.emotion-45 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-45::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-45.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-45 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-45:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-45.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-45:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-45:hover {
+    box-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);
+  }
+}
+
+.emotion-45:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-45.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-45.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-45:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-45.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+        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-2"
+        >
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_0"
+                              name="root.0"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="foo"
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <button
+                className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-15"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-16"
+                  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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-15"
+                disabled={null}
+                id="root_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-16"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-19"
+                disabled={null}
+                id="root_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-16"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-3"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-4"
+              style={
+                {
+                  "overflow": "auto",
+                }
+              }
+            >
+              <div
+                className="MuiBox-root emotion-5"
+              >
+                <div
+                  className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-1"
+                  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-2"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div
+                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                      >
+                        <div
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          className="MuiFormControl-root MuiTextField-root emotion-9"
+                        >
+                          <div
+                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-10"
+                            onClick={[Function]}
+                          >
+                            <input
+                              aria-invalid={false}
+                              autoFocus={false}
+                              className="MuiInputBase-input MuiOutlinedInput-input emotion-11"
+                              disabled={false}
+                              id="root_1"
+                              name="root.1"
+                              onAnimationStart={[Function]}
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              required={true}
+                              type="text"
+                              value="bar"
+                            />
+                            <fieldset
+                              aria-hidden={true}
+                              className="MuiOutlinedInput-notchedOutline emotion-12"
+                            >
+                              <legend
+                                className="emotion-13"
+                              >
+                                <span
+                                  aria-hidden={true}
+                                  className="notranslate"
+                                >
+                                  ​
+                                </span>
+                              </legend>
+                            </fieldset>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <button
+                className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-15"
+                disabled={null}
+                id="root_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-16"
+                  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-15"
+                disabled={true}
+                id="root_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"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-16"
+                  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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-19"
+                disabled={null}
+                id="root_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-16"
+                  data-testid="RemoveIcon"
+                  focusable="false"
+                  viewBox="0 0 24 24"
+                >
+                  <path
+                    d="M19 13H5v-2h14z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+          <div
+            className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-39"
+          >
+            <div
+              className="MuiGrid-root MuiGrid-direction-xs-row emotion-14"
+            >
+              <div
+                className="MuiBox-root emotion-41"
+              >
+                <button
+                  className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-42"
+                  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-43"
+                    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>
+  </div>
+  <div
+    className="MuiBox-root emotion-44"
+  >
+    <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-45"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 .emotion-0 {
   display: -webkit-inline-box;
diff --git a/packages/mui/test/__snapshots__/Form.test.tsx.snap b/packages/mui/test/__snapshots__/Form.test.tsx.snap
index b9360e0929..427488ae4e 100644
--- a/packages/mui/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/mui/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,12637 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-5 {
+  padding: 16px;
+}
+
+.emotion-6 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-7 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-8 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-10 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-11 {
+  margin-bottom: 16px;
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-22 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-22.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-22.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-22.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-23 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-23.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-23:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-23:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-23.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-23.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-23.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-23.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-24 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-24::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24:focus {
+  outline: 0;
+}
+
+.emotion-24:invalid {
+  box-shadow: none;
+}
+
+.emotion-24::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-24.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-24:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-24:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-25 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-26 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-26>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-29 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-29.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-29 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-30 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-30::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-30.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-30 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-30:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-30.Mui-checked,
+.emotion-30.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-30.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-30:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-31 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-32 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-33 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-34 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-35 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-35::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-35.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-35 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-35:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-35:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-35.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-35.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-36 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-39 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-39::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-39.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-39 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-39:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-39:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-39.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-39.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-73 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-73>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-73>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-73>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-75 {
+  margin-top: 16px;
+}
+
+.emotion-76 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-76::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-76.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-76 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-76:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-76:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-76.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-76.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-78 {
+  margin-top: 24px;
+}
+
+.emotion-79 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-79::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-79.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-79 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-79:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-79.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-79:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-79:hover {
+    box-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);
+  }
+}
+
+.emotion-79:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-79.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-79.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-79:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-79.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                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-5"
+                >
+                  <div
+                    className="MuiBox-root emotion-6"
+                    id="root_tasks__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-7"
+                      style={{}}
+                    >
+                      tasks
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                    />
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-6"
+                                  id="root_tasks_0__title"
+                                >
+                                  <h5
+                                    className="MuiTypography-root MuiTypography-h5 emotion-7"
+                                    style={{}}
+                                  >
+                                    tasks-1
+                                  </h5>
+                                  <hr
+                                    className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                                  />
+                                </div>
+                                <div
+                                  className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                                  style={
+                                    {
+                                      "marginTop": "10px",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                                    style={
+                                      {
+                                        "marginBottom": "10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="rjsf-field rjsf-field-string"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <div
+                                          aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                          className="MuiFormControl-root MuiTextField-root emotion-21"
+                                        >
+                                          <label
+                                            className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-22"
+                                            data-shrink={false}
+                                            htmlFor="root_tasks_0_title"
+                                            id="root_tasks_0_title-label"
+                                          >
+                                            title
+                                          </label>
+                                          <div
+                                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-23"
+                                            onClick={[Function]}
+                                          >
+                                            <input
+                                              aria-invalid={false}
+                                              autoFocus={false}
+                                              className="MuiInputBase-input MuiOutlinedInput-input emotion-24"
+                                              disabled={false}
+                                              id="root_tasks_0_title"
+                                              name="root[tasks][0][title]"
+                                              onAnimationStart={[Function]}
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              required={false}
+                                              type="text"
+                                              value="Task 1"
+                                            />
+                                            <fieldset
+                                              aria-hidden={true}
+                                              className="MuiOutlinedInput-notchedOutline emotion-25"
+                                            >
+                                              <legend
+                                                className="emotion-26"
+                                              >
+                                                <span>
+                                                  title
+                                                </span>
+                                              </legend>
+                                            </fieldset>
+                                          </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"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <label
+                                          className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-29"
+                                        >
+                                          <span
+                                            aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                            className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-30"
+                                            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}
+                                          >
+                                            <input
+                                              autoFocus={false}
+                                              checked={false}
+                                              className="PrivateSwitchBase-input emotion-31"
+                                              data-indeterminate={false}
+                                              disabled={false}
+                                              id="root_tasks_0_done"
+                                              name="root[tasks][0][done]"
+                                              onChange={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                            <svg
+                                              aria-hidden={true}
+                                              className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-32"
+                                              data-testid="CheckBoxOutlineBlankIcon"
+                                              focusable="false"
+                                              viewBox="0 0 24 24"
+                                            >
+                                              <path
+                                                d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                                              />
+                                            </svg>
+                                          </span>
+                                          <span
+                                            className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-33"
+                                            style={{}}
+                                          >
+                                            done
+                                          </span>
+                                        </label>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <button
+                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-35"
+                        disabled={true}
+                        id="root_tasks_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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-36"
+                          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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-35"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-39"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-6"
+                                  id="root_tasks_1__title"
+                                >
+                                  <h5
+                                    className="MuiTypography-root MuiTypography-h5 emotion-7"
+                                    style={{}}
+                                  >
+                                    tasks-2
+                                  </h5>
+                                  <hr
+                                    className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                                  />
+                                </div>
+                                <div
+                                  className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                                  style={
+                                    {
+                                      "marginTop": "10px",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                                    style={
+                                      {
+                                        "marginBottom": "10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="rjsf-field rjsf-field-string"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <div
+                                          aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                          className="MuiFormControl-root MuiTextField-root emotion-21"
+                                        >
+                                          <label
+                                            className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-22"
+                                            data-shrink={false}
+                                            htmlFor="root_tasks_1_title"
+                                            id="root_tasks_1_title-label"
+                                          >
+                                            title
+                                          </label>
+                                          <div
+                                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-23"
+                                            onClick={[Function]}
+                                          >
+                                            <input
+                                              aria-invalid={false}
+                                              autoFocus={false}
+                                              className="MuiInputBase-input MuiOutlinedInput-input emotion-24"
+                                              disabled={false}
+                                              id="root_tasks_1_title"
+                                              name="root[tasks][1][title]"
+                                              onAnimationStart={[Function]}
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              required={false}
+                                              type="text"
+                                              value="Task 2"
+                                            />
+                                            <fieldset
+                                              aria-hidden={true}
+                                              className="MuiOutlinedInput-notchedOutline emotion-25"
+                                            >
+                                              <legend
+                                                className="emotion-26"
+                                              >
+                                                <span>
+                                                  title
+                                                </span>
+                                              </legend>
+                                            </fieldset>
+                                          </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"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <label
+                                          className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-29"
+                                        >
+                                          <span
+                                            aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__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-30"
+                                            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}
+                                          >
+                                            <input
+                                              autoFocus={false}
+                                              checked={true}
+                                              className="PrivateSwitchBase-input emotion-31"
+                                              data-indeterminate={false}
+                                              disabled={false}
+                                              id="root_tasks_1_done"
+                                              name="root[tasks][1][done]"
+                                              onChange={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                            <svg
+                                              aria-hidden={true}
+                                              className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-32"
+                                              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
+                                            className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-33"
+                                            style={{}}
+                                          >
+                                            done
+                                          </span>
+                                        </label>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <button
+                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-35"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          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-35"
+                        disabled={true}
+                        id="root_tasks_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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-36"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-39"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-73"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <div
+                        className="MuiBox-root emotion-75"
+                      >
+                        <button
+                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-76"
+                          disabled={null}
+                          id="root_tasks__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-32"
+                            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>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-78"
+  >
+    <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-79"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-5 {
+  padding: 16px;
+}
+
+.emotion-6 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-7 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-8 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-10 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-11 {
+  margin-bottom: 16px;
+}
+
+.emotion-15 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-16 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(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-16.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-16.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-16.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-17.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-18 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-18.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-18:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-18:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-18.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-18.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-19 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-19::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19:focus {
+  outline: 0;
+}
+
+.emotion-19:invalid {
+  box-shadow: none;
+}
+
+.emotion-19::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-19.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-19:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-19:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-20 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-21 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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-21>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-22 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-23 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-23::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-23.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-23 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-23:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-23:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-23.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-23.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-24 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-27.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-49 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-49>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-49>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-49>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-51 {
+  margin-top: 16px;
+}
+
+.emotion-52 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-52::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-52.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-52 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-52:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-52:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-52.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-52.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-53 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-54 {
+  margin-top: 24px;
+}
+
+.emotion-55 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-55::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-55.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-55 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-55:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-55.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-55:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-55:hover {
+    box-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);
+  }
+}
+
+.emotion-55:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-55.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-55.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-55:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-55.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                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-5"
+                >
+                  <div
+                    className="MuiBox-root emotion-6"
+                    id="root_tags__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-7"
+                      style={{}}
+                    >
+                      tags
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                    />
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-15"
+                                >
+                                  <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-16"
+                                    data-shrink={true}
+                                    htmlFor="root_tags_0"
+                                    id="root_tags_0-label"
+                                  >
+                                    tags-0
+                                    <span
+                                      aria-hidden={true}
+                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-17"
+                                    >
+                                       
+                                      *
+                                    </span>
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                      disabled={false}
+                                      id="root_tags_0"
+                                      name="root[tags][0]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={true}
+                                      type="text"
+                                      value="foo"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-20"
+                                    >
+                                      <legend
+                                        className="emotion-21"
+                                      >
+                                        <span>
+                                          tags-0
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <button
+                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                        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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                          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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-23"
+                        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-24"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                        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-24"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-15"
+                                >
+                                  <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-16"
+                                    data-shrink={true}
+                                    htmlFor="root_tags_1"
+                                    id="root_tags_1-label"
+                                  >
+                                    tags-1
+                                    <span
+                                      aria-hidden={true}
+                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-17"
+                                    >
+                                       
+                                      *
+                                    </span>
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                      disabled={false}
+                                      id="root_tags_1"
+                                      name="root[tags][1]"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={true}
+                                      type="text"
+                                      value="bar"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-20"
+                                    >
+                                      <legend
+                                        className="emotion-21"
+                                      >
+                                        <span>
+                                          tags-1
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <button
+                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                        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-24"
+                          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-23"
+                        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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                        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-24"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-49"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <div
+                        className="MuiBox-root emotion-51"
+                      >
+                        <button
+                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-52"
+                          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"
+                          type="button"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-53"
+                            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>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-54"
+  >
+    <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-55"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+}
+
+.emotion-4.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-4.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-4.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-5 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+}
+
+.emotion-6 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-6.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-6 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-7::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-7.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-7 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-7:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-7.Mui-checked,
+.emotion-7.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-7.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-7:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-8 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-9 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-10 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-21 {
+  margin-top: 24px;
+}
+
+.emotion-22 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-22::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-22.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-22 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-22:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-22.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-22:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-22:hover {
+    box-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);
+  }
+}
+
+.emotion-22:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-22.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-22.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-22:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-22.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <label
+                className="MuiFormLabel-root MuiFormLabel-colorPrimary emotion-4"
+                htmlFor="root_choices"
+              >
+                choices
+              </label>
+              <div
+                className="MuiFormGroup-root emotion-5"
+                id="root_choices"
+              >
+                <label
+                  className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-6"
+                >
+                  <span
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-7"
+                    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}
+                  >
+                    <input
+                      autoFocus={false}
+                      checked={false}
+                      className="PrivateSwitchBase-input emotion-8"
+                      data-indeterminate={false}
+                      disabled={false}
+                      id="root_choices-0"
+                      name="root[choices][]"
+                      onChange={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <svg
+                      aria-hidden={true}
+                      className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-9"
+                      data-testid="CheckBoxOutlineBlankIcon"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-10"
+                    style={{}}
+                  >
+                    foo
+                  </span>
+                </label>
+                <label
+                  className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-6"
+                >
+                  <span
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-7"
+                    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}
+                  >
+                    <input
+                      autoFocus={false}
+                      checked={false}
+                      className="PrivateSwitchBase-input emotion-8"
+                      data-indeterminate={false}
+                      disabled={false}
+                      id="root_choices-1"
+                      name="root[choices][]"
+                      onChange={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <svg
+                      aria-hidden={true}
+                      className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-9"
+                      data-testid="CheckBoxOutlineBlankIcon"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-10"
+                    style={{}}
+                  >
+                    bar
+                  </span>
+                </label>
+                <label
+                  className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-6"
+                >
+                  <span
+                    aria-describedby="root_choices__error root_choices__description root_choices__help"
+                    className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-7"
+                    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}
+                  >
+                    <input
+                      autoFocus={false}
+                      checked={false}
+                      className="PrivateSwitchBase-input emotion-8"
+                      data-indeterminate={false}
+                      disabled={false}
+                      id="root_choices-2"
+                      name="root[choices][]"
+                      onChange={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <svg
+                      aria-hidden={true}
+                      className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-9"
+                      data-testid="CheckBoxOutlineBlankIcon"
+                      focusable="false"
+                      viewBox="0 0 24 24"
+                    >
+                      <path
+                        d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                      />
+                    </svg>
+                  </span>
+                  <span
+                    className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-10"
+                    style={{}}
+                  >
+                    baz
+                  </span>
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-21"
+  >
+    <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-22"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-5 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-6 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-10 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-11 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-11.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-11.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-12 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-12:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-12:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-12.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-12.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-13::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13:focus {
+  outline: 0;
+}
+
+.emotion-13:invalid {
+  box-shadow: none;
+}
+
+.emotion-13::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-13.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-13:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-14 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-15 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-15>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-46 {
+  margin-top: 24px;
+}
+
+.emotion-47 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-47::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-47.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-47 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-47:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-47:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-47:hover {
+    box-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);
+  }
+}
+
+.emotion-47:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-47:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-47.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiBox-root emotion-4"
+                id="root_person__title"
+              >
+                <h5
+                  className="MuiTypography-root MuiTypography-h5 emotion-5"
+                  style={{}}
+                >
+                  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",
+                  }
+                }
+              >
+                <div
+                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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_firstName"
+                          id="root_person_firstName-label"
+                        >
+                          firstName
+                        </label>
+                        <div
+                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                          onClick={[Function]}
+                        >
+                          <input
+                            aria-invalid={false}
+                            autoFocus={false}
+                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                            disabled={false}
+                            id="root_person_firstName"
+                            name="root[person][firstName]"
+                            onAnimationStart={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value=""
+                          />
+                          <fieldset
+                            aria-hidden={true}
+                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                firstName
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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_lastName"
+                          id="root_person_lastName-label"
+                        >
+                          lastName
+                        </label>
+                        <div
+                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                          onClick={[Function]}
+                        >
+                          <input
+                            aria-invalid={false}
+                            autoFocus={false}
+                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                            disabled={false}
+                            id="root_person_lastName"
+                            name="root[person][lastName]"
+                            onAnimationStart={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value=""
+                          />
+                          <fieldset
+                            aria-hidden={true}
+                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                lastName
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        className="MuiBox-root emotion-4"
+                        id="root_person_address__title"
+                      >
+                        <h5
+                          className="MuiTypography-root MuiTypography-h5 emotion-5"
+                          style={{}}
+                        >
+                          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",
+                          }
+                        }
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                          style={
+                            {
+                              "marginBottom": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        street
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </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"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        city
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+}
+
+.emotion-4.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-4.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-4.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-5 {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+}
+
+.emotion-6 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-6.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-6 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-7::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-7.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-7 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-7.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-7.Mui-checked {
+  color: #1976d2;
+}
+
+@media (hover: none) {
+  .emotion-7:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-8 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-9 {
+  position: relative;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.emotion-10 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+  -webkit-transform: scale(1);
+  -moz-transform: scale(1);
+  -ms-transform: scale(1);
+  transform: scale(1);
+}
+
+.emotion-11 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+  left: 0;
+  position: absolute;
+  -webkit-transform: scale(0);
+  -moz-transform: scale(0);
+  -ms-transform: scale(0);
+  transform: scale(0);
+  -webkit-transition: -webkit-transform 150ms cubic-bezier(0.4, 0, 1, 1) 0ms;
+  transition: transform 150ms cubic-bezier(0.4, 0, 1, 1) 0ms;
+}
+
+.emotion-12 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-20 {
+  margin-top: 24px;
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-21::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-21.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-21 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-21:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-21.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-21:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-21:hover {
+    box-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);
+  }
+}
+
+.emotion-21:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-21.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-21.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-21:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-21.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <label
+                className="MuiFormLabel-root MuiFormLabel-colorPrimary emotion-4"
+                htmlFor="root_option"
+              >
+                option
+              </label>
+              <div
+                aria-describedby="root_option__error root_option__description root_option__help"
+                className="MuiFormGroup-root MuiRadioGroup-root emotion-5"
+                id="root_option"
+                onBlur={[Function]}
+                onFocus={[Function]}
+                role="radiogroup"
+              >
+                <label
+                  className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-6"
+                >
+                  <span
+                    className="MuiButtonBase-root MuiRadio-root MuiRadio-colorPrimary PrivateSwitchBase-root MuiRadio-root MuiRadio-colorPrimary MuiRadio-root MuiRadio-colorPrimary emotion-7"
+                    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}
+                  >
+                    <input
+                      checked={false}
+                      className="PrivateSwitchBase-input emotion-8"
+                      disabled={false}
+                      id="root_option-0"
+                      name="root[option]"
+                      onChange={[Function]}
+                      required={false}
+                      type="radio"
+                      value="0"
+                    />
+                    <span
+                      className="emotion-9"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-10"
+                        data-testid="RadioButtonUncheckedIcon"
+                        focusable="false"
+                        viewBox="0 0 24 24"
+                      >
+                        <path
+                          d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+                        />
+                      </svg>
+                      <svg
+                        aria-hidden={true}
+                        className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-11"
+                        data-testid="RadioButtonCheckedIcon"
+                        focusable="false"
+                        viewBox="0 0 24 24"
+                      >
+                        <path
+                          d="M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
+                        />
+                      </svg>
+                    </span>
+                  </span>
+                  <span
+                    className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-12"
+                    style={{}}
+                  >
+                    foo
+                  </span>
+                </label>
+                <label
+                  className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-6"
+                >
+                  <span
+                    className="MuiButtonBase-root MuiRadio-root MuiRadio-colorPrimary PrivateSwitchBase-root MuiRadio-root MuiRadio-colorPrimary MuiRadio-root MuiRadio-colorPrimary emotion-7"
+                    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}
+                  >
+                    <input
+                      checked={false}
+                      className="PrivateSwitchBase-input emotion-8"
+                      disabled={false}
+                      id="root_option-1"
+                      name="root[option]"
+                      onChange={[Function]}
+                      required={false}
+                      type="radio"
+                      value="1"
+                    />
+                    <span
+                      className="emotion-9"
+                    >
+                      <svg
+                        aria-hidden={true}
+                        className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-10"
+                        data-testid="RadioButtonUncheckedIcon"
+                        focusable="false"
+                        viewBox="0 0 24 24"
+                      >
+                        <path
+                          d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+                        />
+                      </svg>
+                      <svg
+                        aria-hidden={true}
+                        className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-11"
+                        data-testid="RadioButtonCheckedIcon"
+                        focusable="false"
+                        viewBox="0 0 24 24"
+                      >
+                        <path
+                          d="M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
+                        />
+                      </svg>
+                    </span>
+                  </span>
+                  <span
+                    className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-12"
+                    style={{}}
+                  >
+                    bar
+                  </span>
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-20"
+  >
+    <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-21"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  border-radius: 0;
+  cursor: pointer;
+  border-radius: 4px;
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7:focus {
+  border-radius: 0;
+}
+
+.emotion-7.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-7[multiple] {
+  height: auto;
+}
+
+.emotion-7:not([multiple]) option,
+.emotion-7:not([multiple]) optgroup {
+  background-color: #fff;
+}
+
+.emotion-7:focus {
+  border-radius: 4px;
+}
+
+.emotion-7.emotion-7.emotion-7 {
+  padding-right: 32px;
+}
+
+.emotion-7.MuiSelect-select {
+  height: auto;
+  min-height: 1.4375em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  opacity: 0;
+  pointer-events: none;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.emotion-9 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+  position: absolute;
+  right: 0;
+  top: calc(50% - .5em);
+  pointer-events: none;
+  color: rgba(0, 0, 0, 0.54);
+  right: 7px;
+}
+
+.emotion-9.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-10 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-11 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-11>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-12 {
+  margin-top: 24px;
+}
+
+.emotion-13 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-13.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-13 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-13:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-13:hover {
+    box-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);
+  }
+}
+
+.emotion-13:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-13.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-13:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-13.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_color__error root_color__description root_color__help"
+                className="MuiFormControl-root MuiTextField-root 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-5"
+                  data-shrink={false}
+                  htmlFor="root_color"
+                  id="root_color-label"
+                >
+                  color
+                </label>
+                <div
+                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl MuiSelect-root emotion-6"
+                  onClick={[Function]}
+                >
+                  <div
+                    aria-expanded="false"
+                    aria-haspopup="listbox"
+                    aria-labelledby="root_color-label root_color"
+                    className="MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                    id="root_color"
+                    onBlur={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    onMouseDown={[Function]}
+                    role="combobox"
+                    tabIndex={0}
+                  >
+                    <span
+                      aria-hidden={true}
+                      className="notranslate"
+                    >
+                      ​
+                    </span>
+                  </div>
+                  <input
+                    aria-hidden={true}
+                    aria-invalid={false}
+                    autoFocus={false}
+                    className="MuiSelect-nativeInput emotion-8"
+                    disabled={false}
+                    name="root[color]"
+                    onAnimationStart={[Function]}
+                    onChange={[Function]}
+                    placeholder=""
+                    required={false}
+                    tabIndex={-1}
+                    value=""
+                  />
+                  <svg
+                    aria-hidden={true}
+                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSelect-icon MuiSelect-iconOutlined emotion-9"
+                    data-testid="ArrowDropDownIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M7 10l5 5 5-5z"
+                    />
+                  </svg>
+                  <fieldset
+                    aria-hidden={true}
+                    className="MuiOutlinedInput-notchedOutline emotion-10"
+                  >
+                    <legend
+                      className="emotion-11"
+                    >
+                      <span>
+                        color
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-12"
+  >
+    <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-13"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-9>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-20 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-20.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-20 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-21::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-21.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-21 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-21:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-21.Mui-checked,
+.emotion-21.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-21.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-21:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-22 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-23 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-24 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-25 {
+  margin-top: 24px;
+}
+
+.emotion-26 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-26::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-26.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-26 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-26:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-26.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-26:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-26:hover {
+    box-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);
+  }
+}
+
+.emotion-26:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-26.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-26.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-26:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-26.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        firstName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_age__error root_age__description root_age__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        age
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <label
+                className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-20"
+              >
+                <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 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}
+                >
+                  <input
+                    autoFocus={false}
+                    checked={false}
+                    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="CheckBoxOutlineBlankIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                    />
+                  </svg>
+                </span>
+                <span
+                  className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-24"
+                  style={{}}
+                >
+                  active
+                </span>
+              </label>
+            </div>
+          </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  padding: 4px 0 5px;
+  position: relative;
+  border-radius: 4px;
+  padding: 16.5px 14px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  height: auto;
+  resize: none;
+  padding: 0;
+  padding-top: 0;
+  padding: 16.5px 14px;
+  padding: 0;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-9 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-10 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-10>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-11 {
+  margin-top: 24px;
+}
+
+.emotion-12 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-12::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-12.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-12 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-12:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-12:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-12:hover {
+    box-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);
+  }
+}
+
+.emotion-12:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-12.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-12:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-12.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_description__error root_description__description root_description__help"
+                className="MuiFormControl-root MuiTextField-root 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-5"
+                  data-shrink={false}
+                  htmlFor="root_description"
+                  id="root_description-label"
+                >
+                  description
+                </label>
+                <div
+                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl MuiInputBase-multiline emotion-6"
+                  onClick={[Function]}
+                >
+                  <textarea
+                    aria-invalid={false}
+                    autoFocus={false}
+                    className="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMultiline emotion-7"
+                    disabled={false}
+                    id="root_description"
+                    name="root[description]"
+                    onAnimationStart={[Function]}
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={false}
+                    rows={5}
+                    value=""
+                  />
+                  <textarea
+                    aria-hidden={true}
+                    className="MuiInputBase-input MuiOutlinedInput-input MuiInputBase-inputMultiline emotion-7"
+                    readOnly={true}
+                    style={
+                      {
+                        "height": 0,
+                        "left": 0,
+                        "overflow": "hidden",
+                        "paddingBottom": 0,
+                        "paddingTop": 0,
+                        "position": "absolute",
+                        "top": 0,
+                        "transform": "translateZ(0)",
+                        "visibility": "hidden",
+                      }
+                    }
+                    tabIndex={-1}
+                  />
+                  <fieldset
+                    aria-hidden={true}
+                    className="MuiOutlinedInput-notchedOutline emotion-9"
+                  >
+                    <legend
+                      className="emotion-10"
+                    >
+                      <span>
+                        description
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-11"
+  >
+    <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-12"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-5 {
+  padding: 16px;
+}
+
+.emotion-6 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-7 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-8 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-10 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-11 {
+  margin-bottom: 16px;
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-22 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-22.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-22.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-22.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-23 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-23.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-23:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-23:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-23.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-23.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-23.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-23.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-24 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-24::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-24:focus {
+  outline: 0;
+}
+
+.emotion-24:invalid {
+  box-shadow: none;
+}
+
+.emotion-24::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-24:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-24.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-24:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-24:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-25 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-26 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-26>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-29 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-29.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-29 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-30 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-30::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-30.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-30 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-30:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-30.Mui-checked,
+.emotion-30.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-30.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-30:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-31 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-32 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-33 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-34 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-35 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-35::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-35.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-35 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-35:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-35:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-35.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-35.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-36 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-39 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-39::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-39.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-39 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-39:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-39:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-39.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-39.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-73 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-73>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-73>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-73>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-75 {
+  margin-top: 16px;
+}
+
+.emotion-76 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-76::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-76.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-76 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-76:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-76:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-76.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-76.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-78 {
+  margin-top: 24px;
+}
+
+.emotion-79 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-79::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-79.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-79 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-79:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-79.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-79:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-79:hover {
+    box-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);
+  }
+}
+
+.emotion-79:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-79.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-79.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-79:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-79.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                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-5"
+                >
+                  <div
+                    className="MuiBox-root emotion-6"
+                    id="root_tasks__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-7"
+                      style={{}}
+                    >
+                      tasks
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                    />
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-6"
+                                  id="root_tasks_0__title"
+                                >
+                                  <h5
+                                    className="MuiTypography-root MuiTypography-h5 emotion-7"
+                                    style={{}}
+                                  >
+                                    tasks-1
+                                  </h5>
+                                  <hr
+                                    className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                                  />
+                                </div>
+                                <div
+                                  className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                                  style={
+                                    {
+                                      "marginTop": "10px",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                                    style={
+                                      {
+                                        "marginBottom": "10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="rjsf-field rjsf-field-string"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <div
+                                          aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                          className="MuiFormControl-root MuiTextField-root emotion-21"
+                                        >
+                                          <label
+                                            className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-22"
+                                            data-shrink={false}
+                                            htmlFor="root_tasks_0_title"
+                                            id="root_tasks_0_title-label"
+                                          >
+                                            title
+                                          </label>
+                                          <div
+                                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-23"
+                                            onClick={[Function]}
+                                          >
+                                            <input
+                                              aria-invalid={false}
+                                              autoFocus={false}
+                                              className="MuiInputBase-input MuiOutlinedInput-input emotion-24"
+                                              disabled={false}
+                                              id="root_tasks_0_title"
+                                              name="root.tasks.0.title"
+                                              onAnimationStart={[Function]}
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              required={false}
+                                              type="text"
+                                              value="Task 1"
+                                            />
+                                            <fieldset
+                                              aria-hidden={true}
+                                              className="MuiOutlinedInput-notchedOutline emotion-25"
+                                            >
+                                              <legend
+                                                className="emotion-26"
+                                              >
+                                                <span>
+                                                  title
+                                                </span>
+                                              </legend>
+                                            </fieldset>
+                                          </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"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <label
+                                          className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-29"
+                                        >
+                                          <span
+                                            aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                            className="MuiButtonBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium PrivateSwitchBase-root MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium MuiCheckbox-root MuiCheckbox-colorPrimary MuiCheckbox-sizeMedium emotion-30"
+                                            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}
+                                          >
+                                            <input
+                                              autoFocus={false}
+                                              checked={false}
+                                              className="PrivateSwitchBase-input emotion-31"
+                                              data-indeterminate={false}
+                                              disabled={false}
+                                              id="root_tasks_0_done"
+                                              name="root.tasks.0.done"
+                                              onChange={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                            <svg
+                                              aria-hidden={true}
+                                              className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-32"
+                                              data-testid="CheckBoxOutlineBlankIcon"
+                                              focusable="false"
+                                              viewBox="0 0 24 24"
+                                            >
+                                              <path
+                                                d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                                              />
+                                            </svg>
+                                          </span>
+                                          <span
+                                            className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-33"
+                                            style={{}}
+                                          >
+                                            done
+                                          </span>
+                                        </label>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <button
+                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-35"
+                        disabled={true}
+                        id="root_tasks_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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-36"
+                          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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-35"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-39"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-object"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  className="MuiBox-root emotion-6"
+                                  id="root_tasks_1__title"
+                                >
+                                  <h5
+                                    className="MuiTypography-root MuiTypography-h5 emotion-7"
+                                    style={{}}
+                                  >
+                                    tasks-2
+                                  </h5>
+                                  <hr
+                                    className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                                  />
+                                </div>
+                                <div
+                                  className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+                                  style={
+                                    {
+                                      "marginTop": "10px",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                                    style={
+                                      {
+                                        "marginBottom": "10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      className="rjsf-field rjsf-field-string"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <div
+                                          aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                          className="MuiFormControl-root MuiTextField-root emotion-21"
+                                        >
+                                          <label
+                                            className="MuiFormLabel-root MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined MuiFormLabel-colorPrimary MuiInputLabel-root MuiInputLabel-formControl MuiInputLabel-animated MuiInputLabel-outlined emotion-22"
+                                            data-shrink={false}
+                                            htmlFor="root_tasks_1_title"
+                                            id="root_tasks_1_title-label"
+                                          >
+                                            title
+                                          </label>
+                                          <div
+                                            className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-23"
+                                            onClick={[Function]}
+                                          >
+                                            <input
+                                              aria-invalid={false}
+                                              autoFocus={false}
+                                              className="MuiInputBase-input MuiOutlinedInput-input emotion-24"
+                                              disabled={false}
+                                              id="root_tasks_1_title"
+                                              name="root.tasks.1.title"
+                                              onAnimationStart={[Function]}
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              required={false}
+                                              type="text"
+                                              value="Task 2"
+                                            />
+                                            <fieldset
+                                              aria-hidden={true}
+                                              className="MuiOutlinedInput-notchedOutline emotion-25"
+                                            >
+                                              <legend
+                                                className="emotion-26"
+                                              >
+                                                <span>
+                                                  title
+                                                </span>
+                                              </legend>
+                                            </fieldset>
+                                          </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"
+                                    >
+                                      <div
+                                        className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                                      >
+                                        <label
+                                          className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-29"
+                                        >
+                                          <span
+                                            aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__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-30"
+                                            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}
+                                          >
+                                            <input
+                                              autoFocus={false}
+                                              checked={true}
+                                              className="PrivateSwitchBase-input emotion-31"
+                                              data-indeterminate={false}
+                                              disabled={false}
+                                              id="root_tasks_1_done"
+                                              name="root.tasks.1.done"
+                                              onChange={[Function]}
+                                              required={false}
+                                              type="checkbox"
+                                            />
+                                            <svg
+                                              aria-hidden={true}
+                                              className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-32"
+                                              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
+                                            className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-33"
+                                            style={{}}
+                                          >
+                                            done
+                                          </span>
+                                        </label>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <button
+                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-35"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          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-35"
+                        disabled={true}
+                        id="root_tasks_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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-36"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-39"
+                        disabled={null}
+                        id="root_tasks_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-36"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-73"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-34"
+                    >
+                      <div
+                        className="MuiBox-root emotion-75"
+                      >
+                        <button
+                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-76"
+                          disabled={null}
+                          id="root_tasks__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-32"
+                            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>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-78"
+  >
+    <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-79"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-5 {
+  padding: 16px;
+}
+
+.emotion-6 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-7 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-8 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-9 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-9>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-9>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-9>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-10 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-11 {
+  margin-bottom: 16px;
+}
+
+.emotion-15 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-16 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(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-16.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-16.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-16.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-17.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-18 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-18.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-18:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-18:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-18.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-18.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-18.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-19 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-19::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-19:focus {
+  outline: 0;
+}
+
+.emotion-19:invalid {
+  box-shadow: none;
+}
+
+.emotion-19::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-19:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-19.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-19:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-19:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-20 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-21 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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-21>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-22 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-23 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-23::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-23.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-23 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-23:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-23:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-23.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-23.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-24 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-27.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-49 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-49>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-49>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-49>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-51 {
+  margin-top: 16px;
+}
+
+.emotion-52 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-52::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-52.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-52 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-52:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-52:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-52.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-52.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-53 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-54 {
+  margin-top: 24px;
+}
+
+.emotion-55 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-55::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-55.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-55 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-55:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-55.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-55:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-55:hover {
+    box-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);
+  }
+}
+
+.emotion-55:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-55.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-55.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-55:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-55.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-array"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                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-5"
+                >
+                  <div
+                    className="MuiBox-root emotion-6"
+                    id="root_tags__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-7"
+                      style={{}}
+                    >
+                      tags
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-8"
+                    />
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-15"
+                                >
+                                  <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-16"
+                                    data-shrink={true}
+                                    htmlFor="root_tags_0"
+                                    id="root_tags_0-label"
+                                  >
+                                    tags-0
+                                    <span
+                                      aria-hidden={true}
+                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-17"
+                                    >
+                                       
+                                      *
+                                    </span>
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                      disabled={false}
+                                      id="root_tags_0"
+                                      name="root.tags.0"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={true}
+                                      type="text"
+                                      value="foo"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-20"
+                                    >
+                                      <legend
+                                        className="emotion-21"
+                                      >
+                                        <span>
+                                          tags-0
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <button
+                        className="MuiButtonBase-root Mui-disabled MuiIconButton-root Mui-disabled MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                        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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                          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 MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-down emotion-23"
+                        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-24"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                        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-24"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-9"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-auto emotion-10"
+                      style={
+                        {
+                          "overflow": "auto",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-11"
+                      >
+                        <div
+                          className="MuiPaper-root MuiPaper-elevation MuiPaper-rounded MuiPaper-elevation2 emotion-4"
+                          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-5"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-15"
+                                >
+                                  <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-16"
+                                    data-shrink={true}
+                                    htmlFor="root_tags_1"
+                                    id="root_tags_1-label"
+                                  >
+                                    tags-1
+                                    <span
+                                      aria-hidden={true}
+                                      className="MuiFormLabel-asterisk MuiInputLabel-asterisk emotion-17"
+                                    >
+                                       
+                                      *
+                                    </span>
+                                  </label>
+                                  <div
+                                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-18"
+                                    onClick={[Function]}
+                                  >
+                                    <input
+                                      aria-invalid={false}
+                                      autoFocus={false}
+                                      className="MuiInputBase-input MuiOutlinedInput-input emotion-19"
+                                      disabled={false}
+                                      id="root_tags_1"
+                                      name="root.tags.1"
+                                      onAnimationStart={[Function]}
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      required={true}
+                                      type="text"
+                                      value="bar"
+                                    />
+                                    <fieldset
+                                      aria-hidden={true}
+                                      className="MuiOutlinedInput-notchedOutline emotion-20"
+                                    >
+                                      <legend
+                                        className="emotion-21"
+                                      >
+                                        <span>
+                                          tags-1
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <button
+                        className="MuiButtonBase-root MuiIconButton-root MuiIconButton-sizeSmall rjsf-array-item-move-up emotion-23"
+                        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-24"
+                          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-23"
+                        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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="MuiSvgIcon-root MuiSvgIcon-fontSizeSmall emotion-24"
+                          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-colorError MuiIconButton-sizeSmall rjsf-array-item-remove emotion-27"
+                        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-24"
+                          data-testid="RemoveIcon"
+                          focusable="false"
+                          viewBox="0 0 24 24"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </div>
+                  <div
+                    className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row emotion-49"
+                  >
+                    <div
+                      className="MuiGrid-root MuiGrid-direction-xs-row emotion-22"
+                    >
+                      <div
+                        className="MuiBox-root emotion-51"
+                      >
+                        <button
+                          className="MuiButtonBase-root MuiIconButton-root MuiIconButton-colorPrimary MuiIconButton-sizeMedium rjsf-array-item-add emotion-52"
+                          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"
+                          type="button"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium emotion-53"
+                            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>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-54"
+  >
+    <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-55"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-5 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-6 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-10 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-11 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-11.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-11.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-12 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-12:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-12:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-12.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-12.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-13::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13:focus {
+  outline: 0;
+}
+
+.emotion-13:invalid {
+  box-shadow: none;
+}
+
+.emotion-13::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-13.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-13:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-14 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-15 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-15>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-46 {
+  margin-top: 24px;
+}
+
+.emotion-47 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-47::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-47.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-47 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-47:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-47:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-47:hover {
+    box-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);
+  }
+}
+
+.emotion-47:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-47:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-47.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiBox-root emotion-4"
+                id="root_person__title"
+              >
+                <h5
+                  className="MuiTypography-root MuiTypography-h5 emotion-5"
+                  style={{}}
+                >
+                  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",
+                  }
+                }
+              >
+                <div
+                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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_firstName"
+                          id="root_person_firstName-label"
+                        >
+                          firstName
+                        </label>
+                        <div
+                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                          onClick={[Function]}
+                        >
+                          <input
+                            aria-invalid={false}
+                            autoFocus={false}
+                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                            disabled={false}
+                            id="root_person_firstName"
+                            name="root.person.firstName"
+                            onAnimationStart={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value=""
+                          />
+                          <fieldset
+                            aria-hidden={true}
+                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                firstName
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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_lastName"
+                          id="root_person_lastName-label"
+                        >
+                          lastName
+                        </label>
+                        <div
+                          className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-12"
+                          onClick={[Function]}
+                        >
+                          <input
+                            aria-invalid={false}
+                            autoFocus={false}
+                            className="MuiInputBase-input MuiOutlinedInput-input emotion-13"
+                            disabled={false}
+                            id="root_person_lastName"
+                            name="root.person.lastName"
+                            onAnimationStart={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value=""
+                          />
+                          <fieldset
+                            aria-hidden={true}
+                            className="MuiOutlinedInput-notchedOutline emotion-14"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                lastName
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        className="MuiBox-root emotion-4"
+                        id="root_person_address__title"
+                      >
+                        <h5
+                          className="MuiTypography-root MuiTypography-h5 emotion-5"
+                          style={{}}
+                        >
+                          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",
+                          }
+                        }
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                          style={
+                            {
+                              "marginBottom": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        street
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </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"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        city
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  border-radius: 0;
+  cursor: pointer;
+  border-radius: 4px;
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7:focus {
+  border-radius: 0;
+}
+
+.emotion-7.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-7[multiple] {
+  height: auto;
+}
+
+.emotion-7:not([multiple]) option,
+.emotion-7:not([multiple]) optgroup {
+  background-color: #fff;
+}
+
+.emotion-7:focus {
+  border-radius: 4px;
+}
+
+.emotion-7.emotion-7.emotion-7 {
+  padding-right: 32px;
+}
+
+.emotion-7.MuiSelect-select {
+  height: auto;
+  min-height: 1.4375em;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  bottom: 0;
+  left: 0;
+  position: absolute;
+  opacity: 0;
+  pointer-events: none;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.emotion-9 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+  position: absolute;
+  right: 0;
+  top: calc(50% - .5em);
+  pointer-events: none;
+  color: rgba(0, 0, 0, 0.54);
+  right: 7px;
+}
+
+.emotion-9.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-10 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-11 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-11>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-12 {
+  margin-top: 24px;
+}
+
+.emotion-13 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-13.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-13 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-13:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-13:hover {
+    box-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);
+  }
+}
+
+.emotion-13:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-13.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-13.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-13:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-13.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_color__error root_color__description root_color__help"
+                className="MuiFormControl-root MuiTextField-root 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-5"
+                  data-shrink={false}
+                  htmlFor="root_color"
+                  id="root_color-label"
+                >
+                  color
+                </label>
+                <div
+                  className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl MuiSelect-root emotion-6"
+                  onClick={[Function]}
+                >
+                  <div
+                    aria-expanded="false"
+                    aria-haspopup="listbox"
+                    aria-labelledby="root_color-label root_color"
+                    className="MuiSelect-select MuiSelect-outlined MuiInputBase-input MuiOutlinedInput-input emotion-7"
+                    id="root_color"
+                    onBlur={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    onMouseDown={[Function]}
+                    role="combobox"
+                    tabIndex={0}
+                  >
+                    <span
+                      aria-hidden={true}
+                      className="notranslate"
+                    >
+                      ​
+                    </span>
+                  </div>
+                  <input
+                    aria-hidden={true}
+                    aria-invalid={false}
+                    autoFocus={false}
+                    className="MuiSelect-nativeInput emotion-8"
+                    disabled={false}
+                    name="root.color"
+                    onAnimationStart={[Function]}
+                    onChange={[Function]}
+                    placeholder=""
+                    required={false}
+                    tabIndex={-1}
+                    value=""
+                  />
+                  <svg
+                    aria-hidden={true}
+                    className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium MuiSelect-icon MuiSelect-iconOutlined emotion-9"
+                    data-testid="ArrowDropDownIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M7 10l5 5 5-5z"
+                    />
+                  </svg>
+                  <fieldset
+                    aria-hidden={true}
+                    className="MuiOutlinedInput-notchedOutline emotion-10"
+                  >
+                    <legend
+                      className="emotion-11"
+                    >
+                      <span>
+                        color
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div
+    className="MuiBox-root emotion-12"
+  >
+    <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-13"
+      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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-9>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-20 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-20.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-20 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-21::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-21.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-21 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-21:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-21.Mui-checked,
+.emotion-21.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-21.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-21:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-22 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-23 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-24 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-25 {
+  margin-top: 24px;
+}
+
+.emotion-26 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-26::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-26.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-26 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-26:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-26.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-26:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-26:hover {
+    box-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);
+  }
+}
+
+.emotion-26:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-26.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-26.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-26:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-26.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        firstName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_age__error root_age__description root_age__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        age
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <label
+                className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-20"
+              >
+                <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 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}
+                >
+                  <input
+                    autoFocus={false}
+                    checked={false}
+                    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="CheckBoxOutlineBlankIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z"
+                    />
+                  </svg>
+                </span>
+                <span
+                  className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-24"
+                  style={{}}
+                >
+                  active
+                </span>
+              </label>
+            </div>
+          </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 .emotion-0 {
   display: -webkit-inline-box;
diff --git a/packages/mui/test/__snapshots__/Object.test.tsx.snap b/packages/mui/test/__snapshots__/Object.test.tsx.snap
index 46553c50e1..79bedd6537 100644
--- a/packages/mui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/mui/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,7325 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-5 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-6 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-10 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-11 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-11.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-11.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-12 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-12:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-12:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-12.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-12.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-13::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13:focus {
+  outline: 0;
+}
+
+.emotion-13:invalid {
+  box-shadow: none;
+}
+
+.emotion-13::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-13.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-13:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-14 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-15 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-15>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-46 {
+  margin-top: 24px;
+}
+
+.emotion-47 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-47::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-47.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-47 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-47:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-47:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-47:hover {
+    box-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);
+  }
+}
+
+.emotion-47:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-47.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-47:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-47.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiBox-root emotion-4"
+                id="root_person__title"
+              >
+                <h5
+                  className="MuiTypography-root MuiTypography-h5 emotion-5"
+                  style={{}}
+                >
+                  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",
+                  }
+                }
+              >
+                <div
+                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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]}
+                        >
+                          <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"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                name
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        className="MuiBox-root emotion-4"
+                        id="root_person_address__title"
+                      >
+                        <h5
+                          className="MuiTypography-root MuiTypography-h5 emotion-5"
+                          style={{}}
+                        >
+                          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",
+                          }
+                        }
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                          style={
+                            {
+                              "marginBottom": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        street
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </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"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        city
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </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"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        country
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(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 {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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 {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-11 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-11>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-11>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-11>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-12 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-13 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-15 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  width: 100%;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-15.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-15:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-15:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-15.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-15.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-15.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-15.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-28 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-28::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-28.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-28 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-28:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-28:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-28.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-28.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-29 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-30 {
+  --Grid-columns: 12;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-32 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-32::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-32.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-32 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-32:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-32:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-32.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-32.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-34 {
+  margin-top: 24px;
+}
+
+.emotion-35 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-35::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-35.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-35 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-35:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-35.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-35:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-35:hover {
+    box-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);
+  }
+}
+
+.emotion-35:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-35.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-35.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-35:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-35.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_name__error root_name__description root_name__help"
+                className="MuiFormControl-root MuiTextField-root emotion-4"
+              >
+                <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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        name
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <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"
+            >
+              <div
+                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+              >
+                <div
+                  aria-describedby="root_customField__error root_customField__description root_customField__help"
+                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                >
+                  <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"
+                  >
+                    customField
+                  </label>
+                  <div
+                    className="MuiInputBase-root MuiOutlinedInput-root MuiInputBase-colorPrimary MuiInputBase-formControl emotion-6"
+                    onClick={[Function]}
+                  >
+                    <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}
+                      type="text"
+                      value="customValue"
+                    />
+                    <fieldset
+                      aria-hidden={true}
+                      className="MuiOutlinedInput-notchedOutline emotion-8"
+                    >
+                      <legend
+                        className="emotion-9"
+                      >
+                        <span>
+                          customField
+                        </span>
+                      </legend>
+                    </fieldset>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="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"
+                type="button"
+              >
+                <svg
+                  aria-hidden={true}
+                  className="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
+          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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-9>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-20 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  cursor: pointer;
+  vertical-align: middle;
+  -webkit-tap-highlight-color: transparent;
+  margin-left: -11px;
+  margin-right: 16px;
+}
+
+.emotion-20.Mui-disabled {
+  cursor: default;
+}
+
+.emotion-20 .MuiFormControlLabel-label.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-21 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  padding: 9px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.6);
+}
+
+.emotion-21::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-21.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-21 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-21:hover {
+  background-color: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-21.Mui-checked,
+.emotion-21.MuiCheckbox-indeterminate {
+  color: #1976d2;
+}
+
+.emotion-21.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+@media (hover: none) {
+  .emotion-21:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-22 {
+  cursor: inherit;
+  position: absolute;
+  opacity: 0;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  margin: 0;
+  padding: 0;
+  z-index: 1;
+}
+
+.emotion-23 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-24 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.5;
+  letter-spacing: 0.00938em;
+}
+
+.emotion-27 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-28 {
+  padding: 16px;
+}
+
+.emotion-29 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-30 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-31 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-32 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-32>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-32>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-32>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-33 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-34 {
+  margin-bottom: 16px;
+}
+
+.emotion-40.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-45 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-46 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-46::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-46.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-46 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-46:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-46:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-46.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-46.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-47 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-50 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-50::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-50.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-50 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-50:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-50:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-50.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-50.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-72 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-72>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-72>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-72>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-74 {
+  margin-top: 16px;
+}
+
+.emotion-75 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-75::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-75.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-75 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-75:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-75:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-75.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-75.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-77 {
+  margin-top: 24px;
+}
+
+.emotion-78 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-78::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-78.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-78 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-78:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-78.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-78:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-78:hover {
+    box-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);
+  }
+}
+
+.emotion-78:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-78.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-78.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-78:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-78.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_name__error root_name__description root_name__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        name
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_age__error root_age__description root_age__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        age
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <label
+                className="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd emotion-20"
+              >
+                <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}
+                >
+                  <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"
+                  >
+                    <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
+                  className="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label emotion-24"
+                  style={{}}
+                >
+                  active
+                </span>
+              </label>
+            </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <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)",
+                  }
+                }
+              >
+                <div
+                  className="MuiBox-root emotion-28"
+                >
+                  <div
+                    className="MuiBox-root emotion-29"
+                    id="root_tags__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-30"
+                      style={{}}
+                    >
+                      tags
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-31"
+                    />
+                  </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",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-34"
+                      >
+                        <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)",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiBox-root emotion-28"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_0__error root_tags_0__description root_tags_0__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                >
+                                  <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]}
+                                  >
+                                    <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"
+                                    >
+                                      <legend
+                                        className="emotion-9"
+                                      >
+                                        <span>
+                                          tags-0
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </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"
+                      >
+                        <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 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"
+                        >
+                          <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"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </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",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-34"
+                      >
+                        <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)",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiBox-root emotion-28"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_tags_1__error root_tags_1__description root_tags_1__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                >
+                                  <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]}
+                                  >
+                                    <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"
+                                    >
+                                      <legend
+                                        className="emotion-9"
+                                      >
+                                        <span>
+                                          tags-1
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="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-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"
+                        >
+                          <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"
+                      >
+                        <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"
+                          type="button"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="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>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-9>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-26 {
+  margin-top: 24px;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-27.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    box-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);
+  }
+}
+
+.emotion-27:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-27.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-27.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-27:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-27.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        firstName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        lastName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_age__error root_age__description root_age__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        age
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-5 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-6 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-10 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-11 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-11.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-11.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-11.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-12 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-12.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-12:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-12:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-12.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-12.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-12.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-13 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-13::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-13:focus {
+  outline: 0;
+}
+
+.emotion-13:invalid {
+  box-shadow: none;
+}
+
+.emotion-13::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-13:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-13.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-13:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-13:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-14 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-15 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-15>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-38 {
+  margin-top: 24px;
+}
+
+.emotion-39 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-39::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-39.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-39 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-39:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-39.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-39:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-39:hover {
+    box-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);
+  }
+}
+
+.emotion-39:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-39.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-39.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-39:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-39.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                className="MuiBox-root emotion-4"
+                id="root_person__title"
+              >
+                <h5
+                  className="MuiTypography-root MuiTypography-h5 emotion-5"
+                  style={{}}
+                >
+                  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",
+                  }
+                }
+              >
+                <div
+                  className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                  style={
+                    {
+                      "marginBottom": "10px",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        aria-describedby="root_person_name__error root_person_name__description root_person_name__help"
+                        className="MuiFormControl-root MuiTextField-root emotion-10"
+                      >
+                        <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]}
+                        >
+                          <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"
+                          >
+                            <legend
+                              className="emotion-15"
+                            >
+                              <span>
+                                name
+                              </span>
+                            </legend>
+                          </fieldset>
+                        </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"
+                  >
+                    <div
+                      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                    >
+                      <div
+                        className="MuiBox-root emotion-4"
+                        id="root_person_address__title"
+                      >
+                        <h5
+                          className="MuiTypography-root MuiTypography-h5 emotion-5"
+                          style={{}}
+                        >
+                          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",
+                          }
+                        }
+                      >
+                        <div
+                          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+                          style={
+                            {
+                              "marginBottom": "10px",
+                            }
+                          }
+                        >
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        street
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </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"
+                          >
+                            <div
+                              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                            >
+                              <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"
+                              >
+                                <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]}
+                                >
+                                  <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"
+                                  >
+                                    <legend
+                                      className="emotion-15"
+                                    >
+                                      <span>
+                                        city
+                                      </span>
+                                    </legend>
+                                  </fieldset>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(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 {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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 {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-20 {
+  background-color: #fff;
+  color: rgba(0, 0, 0, 0.87);
+  -webkit-transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: box-shadow 300ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  border-radius: 4px;
+  box-shadow: var(--Paper-shadow);
+  background-image: var(--Paper-overlay);
+}
+
+.emotion-21 {
+  padding: 16px;
+}
+
+.emotion-22 {
+  margin-bottom: 8px;
+  margin-top: 8px;
+}
+
+.emotion-23 {
+  margin: 0;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1.5rem;
+  line-height: 1.334;
+  letter-spacing: 0em;
+}
+
+.emotion-24 {
+  margin: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  border-width: 0;
+  border-style: solid;
+  border-color: rgba(0, 0, 0, 0.12);
+  border-bottom-width: thin;
+}
+
+.emotion-25 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.emotion-25>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-25>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-25>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-26 {
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  max-width: none;
+  width: auto;
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-27 {
+  margin-bottom: 16px;
+}
+
+.emotion-33.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-38 {
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-39 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-39::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-39.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-39 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-39:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-39:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-39.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-39.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-40 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.25rem;
+}
+
+.emotion-43 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #d32f2f;
+  --IconButton-hoverBg: rgba(211, 47, 47, 0.04);
+  padding: 5px;
+  font-size: 1.125rem;
+}
+
+.emotion-43::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-43.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-43 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-43:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-43:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-43.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-43.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-65 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 0px;
+  --Grid-rowSpacing: 0px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+  -webkit-box-pack: end;
+  -ms-flex-pack: end;
+  -webkit-justify-content: flex-end;
+  justify-content: flex-end;
+}
+
+.emotion-65>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-65>* {
+  --Grid-parent-columnSpacing: 0px;
+}
+
+.emotion-65>* {
+  --Grid-parent-rowSpacing: 0px;
+}
+
+.emotion-67 {
+  margin-top: 16px;
+}
+
+.emotion-68 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  text-align: center;
+  -webkit-flex: 0 0 auto;
+  -ms-flex: 0 0 auto;
+  flex: 0 0 auto;
+  font-size: 1.5rem;
+  padding: 8px;
+  border-radius: 50%;
+  color: rgba(0, 0, 0, 0.54);
+  -webkit-transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  --IconButton-hoverBg: rgba(0, 0, 0, 0.04);
+  color: #1976d2;
+  --IconButton-hoverBg: rgba(25, 118, 210, 0.04);
+}
+
+.emotion-68::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-68.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-68 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-68:hover {
+  background-color: var(--IconButton-hoverBg);
+}
+
+@media (hover: none) {
+  .emotion-68:hover {
+    background-color: transparent;
+  }
+}
+
+.emotion-68.Mui-disabled {
+  background-color: transparent;
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-68.MuiIconButton-loading {
+  color: transparent;
+}
+
+.emotion-69 {
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  width: 1em;
+  height: 1em;
+  display: inline-block;
+  -webkit-flex-shrink: 0;
+  -ms-flex-negative: 0;
+  flex-shrink: 0;
+  -webkit-transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: fill 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  fill: currentColor;
+  font-size: 1.5rem;
+}
+
+.emotion-70 {
+  margin-top: 24px;
+}
+
+.emotion-71 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-71::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-71.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-71 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-71:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-71.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-71:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-71:hover {
+    box-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);
+  }
+}
+
+.emotion-71:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-71.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-71.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-71:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-71.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_name__error root_name__description root_name__help"
+                className="MuiFormControl-root MuiTextField-root emotion-4"
+              >
+                <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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        name
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_count__error root_count__description root_count__help"
+                className="MuiFormControl-root MuiTextField-root emotion-4"
+              >
+                <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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        count
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <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)",
+                  }
+                }
+              >
+                <div
+                  className="MuiBox-root emotion-21"
+                >
+                  <div
+                    className="MuiBox-root emotion-22"
+                    id="root_items__title"
+                  >
+                    <h5
+                      className="MuiTypography-root MuiTypography-h5 emotion-23"
+                      style={{}}
+                    >
+                      items
+                    </h5>
+                    <hr
+                      className="MuiDivider-root MuiDivider-fullWidth emotion-24"
+                    />
+                  </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",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-27"
+                      >
+                        <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)",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiBox-root emotion-21"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_items_0__error root_items_0__description root_items_0__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                >
+                                  <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]}
+                                  >
+                                    <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"
+                                    >
+                                      <legend
+                                        className="emotion-9"
+                                      >
+                                        <span>
+                                          items-0
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </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"
+                      >
+                        <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 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"
+                        >
+                          <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"
+                        >
+                          <path
+                            d="M19 13H5v-2h14z"
+                          />
+                        </svg>
+                      </button>
+                    </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",
+                        }
+                      }
+                    >
+                      <div
+                        className="MuiBox-root emotion-27"
+                      >
+                        <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)",
+                            }
+                          }
+                        >
+                          <div
+                            className="MuiBox-root emotion-21"
+                          >
+                            <div
+                              className="rjsf-field rjsf-field-string"
+                            >
+                              <div
+                                className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+                              >
+                                <div
+                                  aria-describedby="root_items_1__error root_items_1__description root_items_1__help"
+                                  className="MuiFormControl-root MuiTextField-root emotion-4"
+                                >
+                                  <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]}
+                                  >
+                                    <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"
+                                    >
+                                      <legend
+                                        className="emotion-9"
+                                      >
+                                        <span>
+                                          items-1
+                                           
+                                          *
+                                        </span>
+                                      </legend>
+                                    </fieldset>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </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"
+                      >
+                        <svg
+                          aria-hidden={true}
+                          className="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-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"
+                        >
+                          <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"
+                      >
+                        <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"
+                          type="button"
+                        >
+                          <svg
+                            aria-hidden={true}
+                            className="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>
+          </div>
+        </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+.emotion-0 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+  width: 100%;
+}
+
+.emotion-1 {
+  --Grid-columns: 12;
+  --Grid-columnSpacing: 16px;
+  --Grid-rowSpacing: 16px;
+  -webkit-flex-direction: row;
+  -ms-flex-direction: row;
+  flex-direction: row;
+  min-width: 0;
+  box-sizing: border-box;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-flex-wrap: wrap;
+  -webkit-flex-wrap: wrap;
+  -ms-flex-wrap: wrap;
+  flex-wrap: wrap;
+  gap: var(--Grid-rowSpacing) var(--Grid-columnSpacing);
+}
+
+.emotion-1>* {
+  --Grid-parent-columns: 12;
+}
+
+.emotion-1>* {
+  --Grid-parent-columnSpacing: 16px;
+}
+
+.emotion-1>* {
+  --Grid-parent-rowSpacing: 16px;
+}
+
+.emotion-2 {
+  -webkit-box-flex: 0;
+  -webkit-flex-grow: 0;
+  -ms-flex-positive: 0;
+  flex-grow: 0;
+  -webkit-flex-basis: auto;
+  -ms-flex-preferred-size: auto;
+  flex-basis: auto;
+  width: calc(100% * 12 / var(--Grid-parent-columns) - (var(--Grid-parent-columns) - 12) * (var(--Grid-parent-columnSpacing) / var(--Grid-parent-columns)));
+  min-width: 0;
+  box-sizing: border-box;
+}
+
+.emotion-4 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-flex-direction: column;
+  -ms-flex-direction: column;
+  flex-direction: column;
+  position: relative;
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+  vertical-align: top;
+}
+
+.emotion-5 {
+  color: rgba(0, 0, 0, 0.6);
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  padding: 0;
+  position: relative;
+  display: block;
+  transform-origin: top left;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+  position: absolute;
+  left: 0;
+  top: 0;
+  -webkit-transform: translate(0, 20px) scale(1);
+  -moz-transform: translate(0, 20px) scale(1);
+  -ms-transform: translate(0, 20px) scale(1);
+  transform: translate(0, 20px) scale(1);
+  -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;
+  pointer-events: none;
+  -webkit-transform: translate(14px, 16px) scale(1);
+  -moz-transform: translate(14px, 16px) scale(1);
+  -ms-transform: translate(14px, 16px) scale(1);
+  transform: translate(14px, 16px) scale(1);
+  max-width: calc(100% - 24px);
+}
+
+.emotion-5.Mui-focused {
+  color: #1976d2;
+}
+
+.emotion-5.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-5.Mui-error {
+  color: #d32f2f;
+}
+
+.emotion-6 {
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 400;
+  font-size: 1rem;
+  line-height: 1.4375em;
+  letter-spacing: 0.00938em;
+  color: rgba(0, 0, 0, 0.87);
+  box-sizing: border-box;
+  position: relative;
+  cursor: text;
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  position: relative;
+  border-radius: 4px;
+}
+
+.emotion-6.Mui-disabled {
+  color: rgba(0, 0, 0, 0.38);
+  cursor: default;
+}
+
+.emotion-6:hover .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.87);
+}
+
+@media (hover: none) {
+  .emotion-6:hover .MuiOutlinedInput-notchedOutline {
+    border-color: rgba(0, 0, 0, 0.23);
+  }
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-width: 2px;
+}
+
+.emotion-6.Mui-focused .MuiOutlinedInput-notchedOutline {
+  border-color: #1976d2;
+}
+
+.emotion-6.Mui-error .MuiOutlinedInput-notchedOutline {
+  border-color: #d32f2f;
+}
+
+.emotion-6.Mui-disabled .MuiOutlinedInput-notchedOutline {
+  border-color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-7 {
+  font: inherit;
+  letter-spacing: inherit;
+  color: currentColor;
+  padding: 4px 0 5px;
+  border: 0;
+  box-sizing: content-box;
+  background: none;
+  height: 1.4375em;
+  margin: 0;
+  -webkit-tap-highlight-color: transparent;
+  display: block;
+  min-width: 0;
+  width: 100%;
+  -webkit-animation-name: mui-auto-fill-cancel;
+  animation-name: mui-auto-fill-cancel;
+  -webkit-animation-duration: 10ms;
+  animation-duration: 10ms;
+  padding: 16.5px 14px;
+}
+
+.emotion-7::-webkit-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-moz-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7::-ms-input-placeholder {
+  color: currentColor;
+  opacity: 0.42;
+  -webkit-transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: opacity 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-7:focus {
+  outline: 0;
+}
+
+.emotion-7:invalid {
+  box-shadow: none;
+}
+
+.emotion-7::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-webkit-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-moz-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7::-ms-input-placeholder {
+  opacity: 0!important;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-webkit-input-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-moz-placeholder {
+  opacity: 0.42;
+}
+
+label[data-shrink=false]+.MuiInputBase-formControl .emotion-7:focus::-ms-input-placeholder {
+  opacity: 0.42;
+}
+
+.emotion-7.Mui-disabled {
+  opacity: 1;
+  -webkit-text-fill-color: rgba(0, 0, 0, 0.38);
+}
+
+.emotion-7:-webkit-autofill {
+  -webkit-animation-duration: 5000s;
+  animation-duration: 5000s;
+  -webkit-animation-name: mui-auto-fill;
+  animation-name: mui-auto-fill;
+}
+
+.emotion-7:-webkit-autofill {
+  border-radius: inherit;
+}
+
+.emotion-8 {
+  text-align: left;
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  top: -5px;
+  left: 0;
+  margin: 0;
+  padding: 0 8px;
+  pointer-events: none;
+  border-radius: inherit;
+  border-style: solid;
+  border-width: 1px;
+  overflow: hidden;
+  min-width: 0%;
+  border-color: rgba(0, 0, 0, 0.23);
+}
+
+.emotion-9 {
+  float: unset;
+  width: auto;
+  overflow: hidden;
+  display: block;
+  padding: 0;
+  height: 11px;
+  font-size: 0.75em;
+  visibility: hidden;
+  max-width: 0.01px;
+  -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;
+}
+
+.emotion-9>span {
+  padding-left: 5px;
+  padding-right: 5px;
+  display: inline-block;
+  opacity: 0;
+  visibility: visible;
+}
+
+.emotion-26 {
+  margin-top: 24px;
+}
+
+.emotion-27 {
+  display: -webkit-inline-box;
+  display: -webkit-inline-flex;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-align-items: center;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  -webkit-justify-content: center;
+  justify-content: center;
+  position: relative;
+  box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
+  background-color: transparent;
+  outline: 0;
+  border: 0;
+  margin: 0;
+  border-radius: 0;
+  padding: 0;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  -ms-user-select: none;
+  user-select: none;
+  vertical-align: middle;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  -webkit-text-decoration: none;
+  text-decoration: none;
+  color: inherit;
+  font-family: "Roboto","Helvetica","Arial",sans-serif;
+  font-weight: 500;
+  font-size: 0.875rem;
+  line-height: 1.75;
+  letter-spacing: 0.02857em;
+  text-transform: uppercase;
+  min-width: 64px;
+  padding: 6px 16px;
+  border: 0;
+  border-radius: 4px;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  color: var(--variant-containedColor);
+  background-color: var(--variant-containedBg);
+  box-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);
+  --variant-textColor: #1976d2;
+  --variant-outlinedColor: #1976d2;
+  --variant-outlinedBorder: rgba(25, 118, 210, 0.5);
+  --variant-containedColor: #fff;
+  --variant-containedBg: #1976d2;
+  -webkit-transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+  transition: background-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,box-shadow 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms,border-color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
+}
+
+.emotion-27::-moz-focus-inner {
+  border-style: none;
+}
+
+.emotion-27.Mui-disabled {
+  pointer-events: none;
+  cursor: default;
+}
+
+@media print {
+  .emotion-27 {
+    -webkit-print-color-adjust: exact;
+    color-adjust: exact;
+  }
+}
+
+.emotion-27:hover {
+  -webkit-text-decoration: none;
+  text-decoration: none;
+}
+
+.emotion-27.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+}
+
+.emotion-27:hover {
+  box-shadow: 0px 2px 4px -1px rgba(0,0,0,0.2),0px 4px 5px 0px rgba(0,0,0,0.14),0px 1px 10px 0px rgba(0,0,0,0.12);
+}
+
+@media (hover: none) {
+  .emotion-27:hover {
+    box-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);
+  }
+}
+
+.emotion-27:active {
+  box-shadow: 0px 5px 5px -3px rgba(0,0,0,0.2),0px 8px 10px 1px rgba(0,0,0,0.14),0px 3px 14px 2px rgba(0,0,0,0.12);
+}
+
+.emotion-27.Mui-focusVisible {
+  box-shadow: 0px 3px 5px -1px rgba(0,0,0,0.2),0px 6px 10px 0px rgba(0,0,0,0.14),0px 1px 18px 0px rgba(0,0,0,0.12);
+}
+
+.emotion-27.Mui-disabled {
+  color: rgba(0, 0, 0, 0.26);
+  box-shadow: none;
+  background-color: rgba(0, 0, 0, 0.12);
+}
+
+@media (hover: hover) {
+  .emotion-27:hover {
+    --variant-containedBg: #1565c0;
+    --variant-textBg: rgba(25, 118, 210, 0.04);
+    --variant-outlinedBorder: #1976d2;
+    --variant-outlinedBg: rgba(25, 118, 210, 0.04);
+  }
+}
+
+.emotion-27.MuiButton-loading {
+  color: transparent;
+}
+
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+    >
+      <div
+        className="MuiGrid-root MuiGrid-container MuiGrid-direction-xs-row MuiGrid-spacing-xs-2 emotion-1"
+        style={
+          {
+            "marginTop": "10px",
+          }
+        }
+      >
+        <div
+          className="MuiGrid-root MuiGrid-direction-xs-row MuiGrid-grid-xs-12 emotion-2"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_firstName__error root_firstName__description root_firstName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        firstName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_lastName__error root_lastName__description root_lastName__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        lastName
+                      </span>
+                    </legend>
+                  </fieldset>
+                </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"
+          >
+            <div
+              className="MuiFormControl-root MuiFormControl-fullWidth emotion-0"
+            >
+              <div
+                aria-describedby="root_age__error root_age__description root_age__help"
+                className="MuiFormControl-root MuiTextField-root 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-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]}
+                >
+                  <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"
+                  >
+                    <legend
+                      className="emotion-9"
+                    >
+                      <span>
+                        age
+                      </span>
+                    </legend>
+                  </fieldset>
+                </div>
+              </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"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 .emotion-0 {
   display: -webkit-inline-box;
diff --git a/packages/primereact/test/__snapshots__/Array.test.tsx.snap b/packages/primereact/test/__snapshots__/Array.test.tsx.snap
index 81dcedec87..59df789229 100644
--- a/packages/primereact/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/primereact/test/__snapshots__/Array.test.tsx.snap
@@ -1141,6 +1141,3128 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </h5>
+      <fieldset
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields p-fieldset p-component"
+        data-pc-name="fieldset"
+        data-pc-section="root"
+        formData={
+          [
+            {
+              "name": "Item 1",
+              "value": 10,
+            },
+            {
+              "name": "Item 2",
+              "value": 20,
+            },
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_0_name"
+                          >
+                            name
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_0_name"
+                            name="root[0][name]"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 1"
+                          />
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_0_value"
+                          >
+                            value
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_0_value"
+                            name="root[0][value]"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={10}
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_1_name"
+                          >
+                            name
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_1_name"
+                            name="root[1][name]"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 2"
+                          />
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_1_value"
+                          >
+                            value
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_1_value"
+                            name="root[1][value]"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={20}
+                          />
+                        </div>
+                      </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__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>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </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={
+          [
+            "foo",
+            "bar",
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_0__error root_0__description root_0__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_0"
+                        name="root[0]"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_1__error root_1__description root_1__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_1"
+                        name="root[1]"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        type="text"
+                        value="bar"
+                      />
+                    </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__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>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <select
+        aria-describedby="root__error root__description root__help"
+        autoFocus={false}
+        disabled={false}
+        display="comma"
+        id="root"
+        multiple={true}
+        name="root"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        options={
+          [
+            {
+              "disabled": false,
+              "label": "foo",
+              "value": "0",
+            },
+            {
+              "disabled": false,
+              "label": "bar",
+              "value": "1",
+            },
+            {
+              "disabled": false,
+              "label": "baz",
+              "value": "2",
+            },
+          ]
+        }
+        pt={
+          {
+            "root": {
+              "style": {
+                "position": "relative",
+              },
+            },
+          }
+        }
+        value={[]}
+      />
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </h5>
+      <fieldset
+        className="rjsf-field rjsf-field-array rjsf-field-array-fixed-items p-fieldset p-component"
+        data-pc-name="fieldset"
+        data-pc-section="root"
+        errorSchema={{}}
+        formData={
+          [
+            "text",
+            42,
+            true,
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_0__error root_0__description root_0__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_0"
+                        name="root[0]"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        type="text"
+                        value="text"
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-number"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_1__error root_1__description root_1__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_1"
+                        name="root[1]"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        step="any"
+                        type="number"
+                        value={42}
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    className="rjsf-field rjsf-field-boolean"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "alignItems": "center",
+                            "display": "flex",
+                            "flexDirection": "row",
+                            "gap": "0.5rem",
+                          }
+                        }
+                      >
+                        <div
+                          aria-describedby="root_2__error root_2__description root_2__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={{}}
+                        >
+                          <input
+                            aria-describedby="root_2__error root_2__description root_2__help"
+                            aria-invalid={false}
+                            checked={true}
+                            className="p-checkbox-input"
+                            data-pc-section="input"
+                            disabled={false}
+                            id="root_2"
+                            name="root[2]"
+                            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"
+                          >
+                            <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"
+                            >
+                              <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>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </h5>
+      <fieldset
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-array sortable-form-fields p-fieldset p-component"
+        data-pc-name="fieldset"
+        data-pc-section="root"
+        formData={
+          [
+            [
+              "a",
+              "b",
+            ],
+            [
+              "c",
+              "d",
+            ],
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <h5
+                        id="root_0__title"
+                        style={
+                          {
+                            "fontSize": "1.5rem",
+                            "margin": 0,
+                            "marginBottom": "0.2rem",
+                          }
+                        }
+                      >
+                         
+                        *
+                      </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_0"
+                        onClick={null}
+                        style={{}}
+                      >
+                        <div
+                          aria-labelledby="root_0_header"
+                          className="p-toggleable-content"
+                          data-pc-section="toggleablecontent"
+                          id="root_0_content"
+                          role="region"
+                        >
+                          <div
+                            className="p-fieldset-content"
+                            data-pc-section="content"
+                          >
+                            <div>
+                              <div>
+                                <div
+                                  style={
+                                    {
+                                      "position": "relative",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    style={
+                                      {
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": "-10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "flexDirection": "row",
+                                        }
+                                      }
+                                    >
+                                      <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_0_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_0_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_0_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>
+                                    </div>
+                                  </div>
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "display": "flex",
+                                          "flexDirection": "column",
+                                          "gap": "0.5rem",
+                                          "marginBottom": "1rem",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                        autoFocus={false}
+                                        className="p-inputtext p-component p-filled"
+                                        data-pc-name="inputtext"
+                                        data-pc-section="root"
+                                        disabled={false}
+                                        id="root_0_0"
+                                        name="root[0][0]"
+                                        onBeforeInput={[Function]}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onFocus={[Function]}
+                                        onInput={[Function]}
+                                        onKeyDown={[Function]}
+                                        onPaste={[Function]}
+                                        placeholder=""
+                                        required={true}
+                                        type="text"
+                                        value="a"
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  style={
+                                    {
+                                      "position": "relative",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    style={
+                                      {
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": "-10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "flexDirection": "row",
+                                        }
+                                      }
+                                    >
+                                      <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_0_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_0_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_0_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>
+                                    </div>
+                                  </div>
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "display": "flex",
+                                          "flexDirection": "column",
+                                          "gap": "0.5rem",
+                                          "marginBottom": "1rem",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                        autoFocus={false}
+                                        className="p-inputtext p-component p-filled"
+                                        data-pc-name="inputtext"
+                                        data-pc-section="root"
+                                        disabled={false}
+                                        id="root_0_1"
+                                        name="root[0][1]"
+                                        onBeforeInput={[Function]}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onFocus={[Function]}
+                                        onInput={[Function]}
+                                        onKeyDown={[Function]}
+                                        onPaste={[Function]}
+                                        placeholder=""
+                                        required={true}
+                                        type="text"
+                                        value="b"
+                                      />
+                                    </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_0__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>
+                        </div>
+                      </fieldset>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <h5
+                        id="root_1__title"
+                        style={
+                          {
+                            "fontSize": "1.5rem",
+                            "margin": 0,
+                            "marginBottom": "0.2rem",
+                          }
+                        }
+                      >
+                         
+                        *
+                      </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={
+                          [
+                            "c",
+                            "d",
+                          ]
+                        }
+                        id="root_1"
+                        onClick={null}
+                        style={{}}
+                      >
+                        <div
+                          aria-labelledby="root_1_header"
+                          className="p-toggleable-content"
+                          data-pc-section="toggleablecontent"
+                          id="root_1_content"
+                          role="region"
+                        >
+                          <div
+                            className="p-fieldset-content"
+                            data-pc-section="content"
+                          >
+                            <div>
+                              <div>
+                                <div
+                                  style={
+                                    {
+                                      "position": "relative",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    style={
+                                      {
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": "-10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "flexDirection": "row",
+                                        }
+                                      }
+                                    >
+                                      <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_1_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_1_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_1_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>
+                                    </div>
+                                  </div>
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "display": "flex",
+                                          "flexDirection": "column",
+                                          "gap": "0.5rem",
+                                          "marginBottom": "1rem",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                        autoFocus={false}
+                                        className="p-inputtext p-component p-filled"
+                                        data-pc-name="inputtext"
+                                        data-pc-section="root"
+                                        disabled={false}
+                                        id="root_1_0"
+                                        name="root[1][0]"
+                                        onBeforeInput={[Function]}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onFocus={[Function]}
+                                        onInput={[Function]}
+                                        onKeyDown={[Function]}
+                                        onPaste={[Function]}
+                                        placeholder=""
+                                        required={true}
+                                        type="text"
+                                        value="c"
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  style={
+                                    {
+                                      "position": "relative",
+                                    }
+                                  }
+                                >
+                                  <div
+                                    style={
+                                      {
+                                        "position": "absolute",
+                                        "right": 0,
+                                        "top": "-10px",
+                                      }
+                                    }
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "flexDirection": "row",
+                                        }
+                                      }
+                                    >
+                                      <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_1_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_1_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_1_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>
+                                    </div>
+                                  </div>
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      style={
+                                        {
+                                          "display": "flex",
+                                          "flexDirection": "column",
+                                          "gap": "0.5rem",
+                                          "marginBottom": "1rem",
+                                        }
+                                      }
+                                    >
+                                      <input
+                                        aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                        autoFocus={false}
+                                        className="p-inputtext p-component p-filled"
+                                        data-pc-name="inputtext"
+                                        data-pc-section="root"
+                                        disabled={false}
+                                        id="root_1_1"
+                                        name="root[1][1]"
+                                        onBeforeInput={[Function]}
+                                        onBlur={[Function]}
+                                        onChange={[Function]}
+                                        onFocus={[Function]}
+                                        onInput={[Function]}
+                                        onKeyDown={[Function]}
+                                        onPaste={[Function]}
+                                        placeholder=""
+                                        required={true}
+                                        type="text"
+                                        value="d"
+                                      />
+                                    </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_1__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>
+                        </div>
+                      </fieldset>
+                    </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__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>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </h5>
+      <fieldset
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields p-fieldset p-component"
+        data-pc-name="fieldset"
+        data-pc-section="root"
+        formData={
+          [
+            {
+              "name": "Item 1",
+              "value": 10,
+            },
+            {
+              "name": "Item 2",
+              "value": 20,
+            },
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_0_name"
+                          >
+                            name
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_0_name"
+                            name="root.0.name"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 1"
+                          />
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_0_value"
+                          >
+                            value
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_0_value"
+                            name="root.0.value"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={10}
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_1_name"
+                          >
+                            name
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_1_name"
+                            name="root.1.name"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            type="text"
+                            value="Item 2"
+                          />
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_1_value"
+                          >
+                            value
+                             
+                          </label>
+                          <input
+                            aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                            autoFocus={false}
+                            className="p-inputtext p-component p-filled"
+                            data-pc-name="inputtext"
+                            data-pc-section="root"
+                            disabled={false}
+                            id="root_1_value"
+                            name="root.1.value"
+                            onBeforeInput={[Function]}
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            onInput={[Function]}
+                            onKeyDown={[Function]}
+                            onPaste={[Function]}
+                            placeholder=""
+                            required={false}
+                            step="any"
+                            type="number"
+                            value={20}
+                          />
+                        </div>
+                      </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__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>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <h5
+        id="root__title"
+        style={
+          {
+            "fontSize": "1.5rem",
+            "margin": 0,
+            "marginBottom": "0.2rem",
+          }
+        }
+      >
+         
+      </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={
+          [
+            "foo",
+            "bar",
+          ]
+        }
+        id="root"
+        onClick={null}
+        style={{}}
+      >
+        <div
+          aria-labelledby="root_header"
+          className="p-toggleable-content"
+          data-pc-section="toggleablecontent"
+          id="root_content"
+          role="region"
+        >
+          <div
+            className="p-fieldset-content"
+            data-pc-section="content"
+          >
+            <div>
+              <div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_0__error root_0__description root_0__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_0"
+                        name="root.0"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        type="text"
+                        value="foo"
+                      />
+                    </div>
+                  </div>
+                </div>
+                <div
+                  style={
+                    {
+                      "position": "relative",
+                    }
+                  }
+                >
+                  <div
+                    style={
+                      {
+                        "position": "absolute",
+                        "right": 0,
+                        "top": "-10px",
+                      }
+                    }
+                  >
+                    <div
+                      style={
+                        {
+                          "flexDirection": "row",
+                        }
+                      }
+                    >
+                      <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_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_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_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>
+                    </div>
+                  </div>
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      style={
+                        {
+                          "display": "flex",
+                          "flexDirection": "column",
+                          "gap": "0.5rem",
+                          "marginBottom": "1rem",
+                        }
+                      }
+                    >
+                      <input
+                        aria-describedby="root_1__error root_1__description root_1__help"
+                        autoFocus={false}
+                        className="p-inputtext p-component p-filled"
+                        data-pc-name="inputtext"
+                        data-pc-section="root"
+                        disabled={false}
+                        id="root_1"
+                        name="root.1"
+                        onBeforeInput={[Function]}
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        onInput={[Function]}
+                        onKeyDown={[Function]}
+                        onPaste={[Function]}
+                        placeholder=""
+                        required={true}
+                        type="text"
+                        value="bar"
+                      />
+                    </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__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>
+        </div>
+      </fieldset>
+    </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/primereact/test/__snapshots__/Form.test.tsx.snap b/packages/primereact/test/__snapshots__/Form.test.tsx.snap
index af6fb3f9a6..55df43571d 100644
--- a/packages/primereact/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/primereact/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,3821 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <h5
+            id="root_tasks__title"
+            style={
+              {
+                "fontSize": "1.5rem",
+                "margin": 0,
+                "marginBottom": "0.2rem",
+              }
+            }
+          >
+            tasks
+             
+          </h5>
+          <fieldset
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields p-fieldset p-component"
+            data-pc-name="fieldset"
+            data-pc-section="root"
+            formData={
+              [
+                {
+                  "done": false,
+                  "title": "Task 1",
+                },
+                {
+                  "done": true,
+                  "title": "Task 2",
+                },
+              ]
+            }
+            id="root_tasks"
+            onClick={null}
+            style={{}}
+          >
+            <div
+              aria-labelledby="root_tasks_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_tasks_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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_tasks_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_tasks_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_tasks_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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <div
+                            id="root_tasks_0__title"
+                          >
+                            <h5
+                              style={
+                                {
+                                  "fontSize": "1.2rem",
+                                  "margin": 0,
+                                }
+                              }
+                            >
+                              tasks-1
+                               
+                              *
+                            </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",
+                                }
+                              }
+                            >
+                              <div
+                                className="p-divider-content"
+                                data-pc-section="content"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <label
+                                htmlFor="root_tasks_0_title"
+                              >
+                                title
+                                 
+                              </label>
+                              <input
+                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                autoFocus={false}
+                                className="p-inputtext p-component p-filled"
+                                data-pc-name="inputtext"
+                                data-pc-section="root"
+                                disabled={false}
+                                id="root_tasks_0_title"
+                                name="root[tasks][0][title]"
+                                onBeforeInput={[Function]}
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                onInput={[Function]}
+                                onKeyDown={[Function]}
+                                onPaste={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Task 1"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <div
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "flex",
+                                    "flexDirection": "row",
+                                    "gap": "0.5rem",
+                                  }
+                                }
+                              >
+                                <div
+                                  aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                  className="p-checkbox p-component"
+                                  data-p-disabled={false}
+                                  data-p-highlight={false}
+                                  data-pc-name="checkbox"
+                                  data-pc-section="root"
+                                  id={null}
+                                  onBlur={[Function]}
+                                  onContextMenu={null}
+                                  onFocus={[Function]}
+                                  onMouseDown={null}
+                                  style={{}}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    aria-invalid={false}
+                                    checked={false}
+                                    className="p-checkbox-input"
+                                    data-pc-section="input"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root[tasks][0][done]"
+                                    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={false}
+                                    data-pc-section="box"
+                                  />
+                                </div>
+                                <label
+                                  htmlFor="root_tasks_0_done"
+                                >
+                                  done
+                                   
+                                </label>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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_tasks_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_tasks_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_tasks_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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <div
+                            id="root_tasks_1__title"
+                          >
+                            <h5
+                              style={
+                                {
+                                  "fontSize": "1.2rem",
+                                  "margin": 0,
+                                }
+                              }
+                            >
+                              tasks-2
+                               
+                              *
+                            </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",
+                                }
+                              }
+                            >
+                              <div
+                                className="p-divider-content"
+                                data-pc-section="content"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <label
+                                htmlFor="root_tasks_1_title"
+                              >
+                                title
+                                 
+                              </label>
+                              <input
+                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                autoFocus={false}
+                                className="p-inputtext p-component p-filled"
+                                data-pc-name="inputtext"
+                                data-pc-section="root"
+                                disabled={false}
+                                id="root_tasks_1_title"
+                                name="root[tasks][1][title]"
+                                onBeforeInput={[Function]}
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                onInput={[Function]}
+                                onKeyDown={[Function]}
+                                onPaste={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Task 2"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <div
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "flex",
+                                    "flexDirection": "row",
+                                    "gap": "0.5rem",
+                                  }
+                                }
+                              >
+                                <div
+                                  aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__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={{}}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    aria-invalid={false}
+                                    checked={true}
+                                    className="p-checkbox-input"
+                                    data-pc-section="input"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root[tasks][1][done]"
+                                    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"
+                                  >
+                                    <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"
+                                    >
+                                      <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
+                                  htmlFor="root_tasks_1_done"
+                                >
+                                  done
+                                   
+                                </label>
+                              </div>
+                            </div>
+                          </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_tasks__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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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={
+              [
+                "foo",
+                "bar",
+              ]
+            }
+            id="root_tags"
+            onClick={null}
+            style={{}}
+          >
+            <div
+              aria-labelledby="root_tags_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_tags_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_tags_0"
+                          >
+                            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="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <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="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="bar"
+                          />
+                        </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]}
+                    >
+                      <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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_choices"
+          >
+            choices
+             
+          </label>
+          <div
+            id="root_choices"
+            style={
+              {
+                "display": "flex",
+                "flexDirection": "column",
+                "gap": "1rem",
+                "marginBottom": "0.5rem",
+                "marginTop": "0.5rem",
+              }
+            }
+          >
+            <div
+              style={
+                {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "flexDirection": "row",
+                  "gap": "0.5rem",
+                }
+              }
+            >
+              <div
+                aria-describedby="root_choices__error root_choices__description root_choices__help"
+                className="p-checkbox p-component"
+                data-p-disabled={false}
+                data-p-highlight={false}
+                data-pc-name="checkbox"
+                data-pc-section="root"
+                id={null}
+                onBlur={[Function]}
+                onContextMenu={null}
+                onFocus={[Function]}
+                onMouseDown={null}
+                style={{}}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  aria-invalid={false}
+                  checked={false}
+                  className="p-checkbox-input"
+                  data-pc-section="input"
+                  disabled={false}
+                  id="root_choices-0"
+                  name="root[choices][]"
+                  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={false}
+                  data-pc-section="box"
+                />
+              </div>
+              <label
+                htmlFor="root_choices-0"
+              >
+                foo
+                 
+              </label>
+            </div>
+            <div
+              style={
+                {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "flexDirection": "row",
+                  "gap": "0.5rem",
+                }
+              }
+            >
+              <div
+                aria-describedby="root_choices__error root_choices__description root_choices__help"
+                className="p-checkbox p-component"
+                data-p-disabled={false}
+                data-p-highlight={false}
+                data-pc-name="checkbox"
+                data-pc-section="root"
+                id={null}
+                onBlur={[Function]}
+                onContextMenu={null}
+                onFocus={[Function]}
+                onMouseDown={null}
+                style={{}}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  aria-invalid={false}
+                  checked={false}
+                  className="p-checkbox-input"
+                  data-pc-section="input"
+                  disabled={false}
+                  id="root_choices-1"
+                  name="root[choices][]"
+                  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={false}
+                  data-pc-section="box"
+                />
+              </div>
+              <label
+                htmlFor="root_choices-1"
+              >
+                bar
+                 
+              </label>
+            </div>
+            <div
+              style={
+                {
+                  "alignItems": "center",
+                  "display": "flex",
+                  "flexDirection": "row",
+                  "gap": "0.5rem",
+                }
+              }
+            >
+              <div
+                aria-describedby="root_choices__error root_choices__description root_choices__help"
+                className="p-checkbox p-component"
+                data-p-disabled={false}
+                data-p-highlight={false}
+                data-pc-name="checkbox"
+                data-pc-section="root"
+                id={null}
+                onBlur={[Function]}
+                onContextMenu={null}
+                onFocus={[Function]}
+                onMouseDown={null}
+                style={{}}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  aria-invalid={false}
+                  checked={false}
+                  className="p-checkbox-input"
+                  data-pc-section="input"
+                  disabled={false}
+                  id="root_choices-2"
+                  name="root[choices][]"
+                  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={false}
+                  data-pc-section="box"
+                />
+              </div>
+              <label
+                htmlFor="root_choices-2"
+              >
+                baz
+                 
+              </label>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            id="root_person__title"
+          >
+            <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",
+                }
+              }
+            >
+              <div
+                className="p-divider-content"
+                data-pc-section="content"
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <label
+                htmlFor="root_person_firstName"
+              >
+                firstName
+                 
+              </label>
+              <input
+                aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                autoFocus={false}
+                className="p-inputtext p-component"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                disabled={false}
+                id="root_person_firstName"
+                name="root[person][firstName]"
+                onBeforeInput={[Function]}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                onInput={[Function]}
+                onKeyDown={[Function]}
+                onPaste={[Function]}
+                placeholder=""
+                required={false}
+                type="text"
+                value=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <label
+                htmlFor="root_person_lastName"
+              >
+                lastName
+                 
+              </label>
+              <input
+                aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                autoFocus={false}
+                className="p-inputtext p-component"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                disabled={false}
+                id="root_person_lastName"
+                name="root[person][lastName]"
+                onBeforeInput={[Function]}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                onInput={[Function]}
+                onKeyDown={[Function]}
+                onPaste={[Function]}
+                placeholder=""
+                required={false}
+                type="text"
+                value=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <div
+                id="root_person_address__title"
+              >
+                <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",
+                    }
+                  }
+                >
+                  <div
+                    className="p-divider-content"
+                    data-pc-section="content"
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_option"
+          >
+            option
+             
+          </label>
+          <div
+            style={
+              {
+                "display": "flex",
+                "flexDirection": "row",
+                "gap": "1rem",
+              }
+            }
+          >
+            <div
+              style={
+                {
+                  "alignItems": "center",
+                  "display": "flex",
+                }
+              }
+            >
+              <div
+                aria-describedby="root_option__error root_option__description root_option__help"
+                className="p-radiobutton p-component"
+                data-p-checked={false}
+                data-pc-name="radiobutton"
+                data-pc-section="root"
+                id={null}
+                onBlur={[Function]}
+                onFocus={[Function]}
+                style={{}}
+              >
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  className="p-radiobutton-input"
+                  data-pc-section="input"
+                  defaultChecked={false}
+                  disabled={false}
+                  id="root_option-0"
+                  name="root[option]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  tabIndex={null}
+                  type="radio"
+                />
+                <div
+                  className="p-radiobutton-box"
+                  data-pc-section="box"
+                >
+                  <div
+                    className="p-radiobutton-icon"
+                    data-pc-section="icon"
+                  />
+                </div>
+              </div>
+              <label
+                htmlFor="root_option-0"
+                style={
+                  {
+                    "marginLeft": "8px",
+                  }
+                }
+              >
+                foo
+              </label>
+            </div>
+            <div
+              style={
+                {
+                  "alignItems": "center",
+                  "display": "flex",
+                }
+              }
+            >
+              <div
+                aria-describedby="root_option__error root_option__description root_option__help"
+                className="p-radiobutton p-component"
+                data-p-checked={false}
+                data-pc-name="radiobutton"
+                data-pc-section="root"
+                id={null}
+                onBlur={[Function]}
+                onFocus={[Function]}
+                style={{}}
+              >
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  className="p-radiobutton-input"
+                  data-pc-section="input"
+                  defaultChecked={false}
+                  disabled={false}
+                  id="root_option-1"
+                  name="root[option]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  tabIndex={null}
+                  type="radio"
+                />
+                <div
+                  className="p-radiobutton-box"
+                  data-pc-section="box"
+                >
+                  <div
+                    className="p-radiobutton-icon"
+                    data-pc-section="icon"
+                  />
+                </div>
+              </div>
+              <label
+                htmlFor="root_option-1"
+                style={
+                  {
+                    "marginLeft": "8px",
+                  }
+                }
+              >
+                bar
+              </label>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_color"
+          >
+            color
+             
+          </label>
+          <select
+            aria-describedby="root_color__error root_color__description root_color__help"
+            autoFocus={false}
+            disabled={false}
+            id="root_color"
+            name="root[color]"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            options={
+              [
+                {
+                  "disabled": false,
+                  "label": "red",
+                  "value": "0",
+                },
+                {
+                  "disabled": false,
+                  "label": "green",
+                  "value": "1",
+                },
+                {
+                  "disabled": false,
+                  "label": "blue",
+                  "value": "2",
+                },
+              ]
+            }
+            placeholder=""
+            value=""
+          />
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_firstName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_age"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            style={
+              {
+                "alignItems": "center",
+                "display": "flex",
+                "flexDirection": "row",
+                "gap": "0.5rem",
+              }
+            }
+          >
+            <div
+              aria-describedby="root_active__error root_active__description root_active__help"
+              className="p-checkbox p-component"
+              data-p-disabled={false}
+              data-p-highlight={false}
+              data-pc-name="checkbox"
+              data-pc-section="root"
+              id={null}
+              onBlur={[Function]}
+              onContextMenu={null}
+              onFocus={[Function]}
+              onMouseDown={null}
+              style={{}}
+            >
+              <input
+                aria-describedby="root_active__error root_active__description root_active__help"
+                aria-invalid={false}
+                checked={false}
+                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={false}
+                data-pc-section="box"
+              />
+            </div>
+            <label
+              htmlFor="root_active"
+            >
+              active
+               
+            </label>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_description"
+          >
+            description
+             
+          </label>
+          <textarea
+            autoFocus={false}
+            className="p-inputtextarea p-inputtext p-component"
+            data-pc-name="inputtextarea"
+            data-pc-section="root"
+            disabled={false}
+            id="root_description"
+            name="root[description]"
+            onBeforeInput={[Function]}
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            onInput={[Function]}
+            onKeyDown={[Function]}
+            onKeyUp={[Function]}
+            onPaste={[Function]}
+            required={false}
+            rows={5}
+            value=""
+          />
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <h5
+            id="root_tasks__title"
+            style={
+              {
+                "fontSize": "1.5rem",
+                "margin": 0,
+                "marginBottom": "0.2rem",
+              }
+            }
+          >
+            tasks
+             
+          </h5>
+          <fieldset
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields p-fieldset p-component"
+            data-pc-name="fieldset"
+            data-pc-section="root"
+            formData={
+              [
+                {
+                  "done": false,
+                  "title": "Task 1",
+                },
+                {
+                  "done": true,
+                  "title": "Task 2",
+                },
+              ]
+            }
+            id="root_tasks"
+            onClick={null}
+            style={{}}
+          >
+            <div
+              aria-labelledby="root_tasks_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_tasks_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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_tasks_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_tasks_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_tasks_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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <div
+                            id="root_tasks_0__title"
+                          >
+                            <h5
+                              style={
+                                {
+                                  "fontSize": "1.2rem",
+                                  "margin": 0,
+                                }
+                              }
+                            >
+                              tasks-1
+                               
+                              *
+                            </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",
+                                }
+                              }
+                            >
+                              <div
+                                className="p-divider-content"
+                                data-pc-section="content"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <label
+                                htmlFor="root_tasks_0_title"
+                              >
+                                title
+                                 
+                              </label>
+                              <input
+                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                autoFocus={false}
+                                className="p-inputtext p-component p-filled"
+                                data-pc-name="inputtext"
+                                data-pc-section="root"
+                                disabled={false}
+                                id="root_tasks_0_title"
+                                name="root.tasks.0.title"
+                                onBeforeInput={[Function]}
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                onInput={[Function]}
+                                onKeyDown={[Function]}
+                                onPaste={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Task 1"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <div
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "flex",
+                                    "flexDirection": "row",
+                                    "gap": "0.5rem",
+                                  }
+                                }
+                              >
+                                <div
+                                  aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                  className="p-checkbox p-component"
+                                  data-p-disabled={false}
+                                  data-p-highlight={false}
+                                  data-pc-name="checkbox"
+                                  data-pc-section="root"
+                                  id={null}
+                                  onBlur={[Function]}
+                                  onContextMenu={null}
+                                  onFocus={[Function]}
+                                  onMouseDown={null}
+                                  style={{}}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    aria-invalid={false}
+                                    checked={false}
+                                    className="p-checkbox-input"
+                                    data-pc-section="input"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root.tasks.0.done"
+                                    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={false}
+                                    data-pc-section="box"
+                                  />
+                                </div>
+                                <label
+                                  htmlFor="root_tasks_0_done"
+                                >
+                                  done
+                                   
+                                </label>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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_tasks_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_tasks_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_tasks_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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <div
+                            id="root_tasks_1__title"
+                          >
+                            <h5
+                              style={
+                                {
+                                  "fontSize": "1.2rem",
+                                  "margin": 0,
+                                }
+                              }
+                            >
+                              tasks-2
+                               
+                              *
+                            </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",
+                                }
+                              }
+                            >
+                              <div
+                                className="p-divider-content"
+                                data-pc-section="content"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <label
+                                htmlFor="root_tasks_1_title"
+                              >
+                                title
+                                 
+                              </label>
+                              <input
+                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                autoFocus={false}
+                                className="p-inputtext p-component p-filled"
+                                data-pc-name="inputtext"
+                                data-pc-section="root"
+                                disabled={false}
+                                id="root_tasks_1_title"
+                                name="root.tasks.1.title"
+                                onBeforeInput={[Function]}
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                onInput={[Function]}
+                                onKeyDown={[Function]}
+                                onPaste={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Task 2"
+                              />
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              style={
+                                {
+                                  "display": "flex",
+                                  "flexDirection": "column",
+                                  "gap": "0.5rem",
+                                  "marginBottom": "1rem",
+                                }
+                              }
+                            >
+                              <div
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "flex",
+                                    "flexDirection": "row",
+                                    "gap": "0.5rem",
+                                  }
+                                }
+                              >
+                                <div
+                                  aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__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={{}}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    aria-invalid={false}
+                                    checked={true}
+                                    className="p-checkbox-input"
+                                    data-pc-section="input"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root.tasks.1.done"
+                                    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"
+                                  >
+                                    <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"
+                                    >
+                                      <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
+                                  htmlFor="root_tasks_1_done"
+                                >
+                                  done
+                                   
+                                </label>
+                              </div>
+                            </div>
+                          </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_tasks__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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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={
+              [
+                "foo",
+                "bar",
+              ]
+            }
+            id="root_tags"
+            onClick={null}
+            style={{}}
+          >
+            <div
+              aria-labelledby="root_tags_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_tags_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_tags_0"
+                          >
+                            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="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <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="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="bar"
+                          />
+                        </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]}
+                    >
+                      <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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            id="root_person__title"
+          >
+            <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",
+                }
+              }
+            >
+              <div
+                className="p-divider-content"
+                data-pc-section="content"
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <label
+                htmlFor="root_person_firstName"
+              >
+                firstName
+                 
+              </label>
+              <input
+                aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                autoFocus={false}
+                className="p-inputtext p-component"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                disabled={false}
+                id="root_person_firstName"
+                name="root.person.firstName"
+                onBeforeInput={[Function]}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                onInput={[Function]}
+                onKeyDown={[Function]}
+                onPaste={[Function]}
+                placeholder=""
+                required={false}
+                type="text"
+                value=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <label
+                htmlFor="root_person_lastName"
+              >
+                lastName
+                 
+              </label>
+              <input
+                aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                autoFocus={false}
+                className="p-inputtext p-component"
+                data-pc-name="inputtext"
+                data-pc-section="root"
+                disabled={false}
+                id="root_person_lastName"
+                name="root.person.lastName"
+                onBeforeInput={[Function]}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                onInput={[Function]}
+                onKeyDown={[Function]}
+                onPaste={[Function]}
+                placeholder=""
+                required={false}
+                type="text"
+                value=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <div
+                id="root_person_address__title"
+              >
+                <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",
+                    }
+                  }
+                >
+                  <div
+                    className="p-divider-content"
+                    data-pc-section="content"
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_color"
+          >
+            color
+             
+          </label>
+          <select
+            aria-describedby="root_color__error root_color__description root_color__help"
+            autoFocus={false}
+            disabled={false}
+            id="root_color"
+            name="root.color"
+            onBlur={[Function]}
+            onChange={[Function]}
+            onFocus={[Function]}
+            options={
+              [
+                {
+                  "disabled": false,
+                  "label": "red",
+                  "value": "0",
+                },
+                {
+                  "disabled": false,
+                  "label": "green",
+                  "value": "1",
+                },
+                {
+                  "disabled": false,
+                  "label": "blue",
+                  "value": "2",
+                },
+              ]
+            }
+            placeholder=""
+            value=""
+          />
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_firstName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_age"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            style={
+              {
+                "alignItems": "center",
+                "display": "flex",
+                "flexDirection": "row",
+                "gap": "0.5rem",
+              }
+            }
+          >
+            <div
+              aria-describedby="root_active__error root_active__description root_active__help"
+              className="p-checkbox p-component"
+              data-p-disabled={false}
+              data-p-highlight={false}
+              data-pc-name="checkbox"
+              data-pc-section="root"
+              id={null}
+              onBlur={[Function]}
+              onContextMenu={null}
+              onFocus={[Function]}
+              onMouseDown={null}
+              style={{}}
+            >
+              <input
+                aria-describedby="root_active__error root_active__description root_active__help"
+                aria-invalid={false}
+                checked={false}
+                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={false}
+                data-pc-section="box"
+              />
+            </div>
+            <label
+              htmlFor="root_active"
+            >
+              active
+               
+            </label>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/primereact/test/__snapshots__/Object.test.tsx.snap b/packages/primereact/test/__snapshots__/Object.test.tsx.snap
index 40fac5163d..7c19556746 100644
--- a/packages/primereact/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/primereact/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,2201 @@
 // 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"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            id="root_person__title"
+          >
+            <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",
+                }
+              }
+            >
+              <div
+                className="p-divider-content"
+                data-pc-section="content"
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <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="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=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <div
+                id="root_person_address__title"
+              >
+                <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",
+                    }
+                  }
+                >
+                  <div
+                    className="p-divider-content"
+                    data-pc-section="content"
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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",
+              }
+            }
+          >
+            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%",
+              }
+            }
+          />
+        </div>
+        <div
+          style={
+            {
+              "flex": 1,
+            }
+          }
+        >
+          <div
+            style={
+              {
+                "display": "flex",
+                "flexDirection": "column",
+                "gap": "0.5rem",
+                "marginBottom": "1rem",
+              }
+            }
+          >
+            <label
+              htmlFor="root_customField"
+            >
+              customField
+               
+            </label>
+            <input
+              aria-describedby="root_customField__error root_customField__description root_customField__help"
+              autoFocus={false}
+              className="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"
+            />
+          </div>
+        </div>
+        <div>
+          <button
+            className="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"
+            disabled={false}
+            id="root_customField__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>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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="Alice"
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_age"
+          >
+            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}
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            style={
+              {
+                "alignItems": "center",
+                "display": "flex",
+                "flexDirection": "row",
+                "gap": "0.5rem",
+              }
+            }
+          >
+            <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={{}}
+            >
+              <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"
+              >
+                <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"
+                >
+                  <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
+              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",
+            }
+          }
+        >
+          <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
+              aria-labelledby="root_tags_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_tags_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_tags_0"
+                          >
+                            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"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <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="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"
+                          />
+                        </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]}
+                    >
+                      <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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_firstName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_lastName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_age"
+          >
+            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=""
+          />
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <div
+            id="root_person__title"
+          >
+            <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",
+                }
+              }
+            >
+              <div
+                className="p-divider-content"
+                data-pc-section="content"
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <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="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=""
+              />
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              style={
+                {
+                  "display": "flex",
+                  "flexDirection": "column",
+                  "gap": "0.5rem",
+                  "marginBottom": "1rem",
+                }
+              }
+            >
+              <div
+                id="root_person_address__title"
+              >
+                <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",
+                    }
+                  }
+                >
+                  <div
+                    className="p-divider-content"
+                    data-pc-section="content"
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  style={
+                    {
+                      "display": "flex",
+                      "flexDirection": "column",
+                      "gap": "0.5rem",
+                      "marginBottom": "1rem",
+                    }
+                  }
+                >
+                  <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="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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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="Test"
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_count"
+          >
+            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}
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <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
+              aria-labelledby="root_items_header"
+              className="p-toggleable-content"
+              data-pc-section="toggleablecontent"
+              id="root_items_content"
+              role="region"
+            >
+              <div
+                className="p-fieldset-content"
+                data-pc-section="content"
+              >
+                <div>
+                  <div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <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="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"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      style={
+                        {
+                          "position": "relative",
+                        }
+                      }
+                    >
+                      <div
+                        style={
+                          {
+                            "position": "absolute",
+                            "right": 0,
+                            "top": "-10px",
+                          }
+                        }
+                      >
+                        <div
+                          style={
+                            {
+                              "flexDirection": "row",
+                            }
+                          }
+                        >
+                          <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"
+                          >
+                            <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>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          style={
+                            {
+                              "display": "flex",
+                              "flexDirection": "column",
+                              "gap": "0.5rem",
+                              "marginBottom": "1rem",
+                            }
+                          }
+                        >
+                          <label
+                            htmlFor="root_items_1"
+                          >
+                            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"
+                          />
+                        </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]}
+                    >
+                      <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>
+            </div>
+          </fieldset>
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      style={
+        {
+          "display": "flex",
+          "flexDirection": "column",
+          "gap": "0.5rem",
+          "marginBottom": "1rem",
+        }
+      }
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_firstName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_lastName"
+          >
+            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=""
+          />
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          style={
+            {
+              "display": "flex",
+              "flexDirection": "column",
+              "gap": "0.5rem",
+              "marginBottom": "1rem",
+            }
+          }
+        >
+          <label
+            htmlFor="root_age"
+          >
+            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=""
+          />
+        </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"
+    >
+      Submit
+    </span>
+  </button>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/react-bootstrap/test/__snapshots__/Array.test.tsx.snap b/packages/react-bootstrap/test/__snapshots__/Array.test.tsx.snap
index a0ee4521b7..8712e4809f 100644
--- a/packages/react-bootstrap/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/react-bootstrap/test/__snapshots__/Array.test.tsx.snap
@@ -943,6 +943,2830 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <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_0_name"
+                                  >
+                                    name
+                                  </label>
+                                  <input
+                                    aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_0_name"
+                                    name="root[0][name]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    type="text"
+                                    value="Item 1"
+                                  />
+                                </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_0_value"
+                                  >
+                                    value
+                                  </label>
+                                  <input
+                                    aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_0_value"
+                                    name="root[0][value]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    step="any"
+                                    type="number"
+                                    value={10}
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={true}
+                        id="root_0__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={false}
+                        id="root_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_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"
+                        >
+                          <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="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <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_1_name"
+                                  >
+                                    name
+                                  </label>
+                                  <input
+                                    aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_1_name"
+                                    name="root[1][name]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    type="text"
+                                    value="Item 2"
+                                  />
+                                </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_1_value"
+                                  >
+                                    value
+                                  </label>
+                                  <input
+                                    aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_1_value"
+                                    name="root[1][value]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    step="any"
+                                    type="number"
+                                    value={20}
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={false}
+                        id="root_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_1__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_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"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </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__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>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_0"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_0"
+                          name="root[0]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={true}
+                        id="root_0__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={false}
+                        id="root_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_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"
+                        >
+                          <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="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_1"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_1"
+                          name="root[1]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="bar"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={false}
+                        id="root_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_1__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_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"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </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__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>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <label
+        className="form-label"
+        htmlFor="root"
+      />
+      <select
+        aria-describedby="root__error root__description root__help"
+        autoFocus={false}
+        className="form-select"
+        disabled={false}
+        id="root"
+        multiple={true}
+        name="root"
+        onBlur={[Function]}
+        onChange={[Function]}
+        onFocus={[Function]}
+        required={false}
+        value={[]}
+      >
+        <option
+          disabled={false}
+          id="foo"
+          value="0"
+        >
+          foo
+        </option>
+        <option
+          disabled={false}
+          id="bar"
+          value="1"
+        >
+          bar
+        </option>
+        <option
+          disabled={false}
+          id="baz"
+          value="2"
+        >
+          baz
+        </option>
+      </select>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_0"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_0"
+                          name="root[0]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="text"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  />
+                </div>
+              </div>
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_1"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_1"
+                          name="root[1]"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          step="any"
+                          type="number"
+                          value={42}
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  />
+                </div>
+              </div>
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div>
+                        <div
+                          aria-describedby="root_2__error root_2__description root_2__help"
+                          className=""
+                        >
+                          <div
+                            className=""
+                          >
+                            <input
+                              autoFocus={false}
+                              checked={true}
+                              className="form-check-input"
+                              disabled={false}
+                              id="root_2"
+                              name="root[2]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              required={false}
+                              type="checkbox"
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div>
+                        <div>
+                          <div
+                            className="p-0 m-0 row"
+                          >
+                            <div
+                              className="p-0 m-0 col"
+                            >
+                              <div
+                                className="p-0 m-0 container-fluid"
+                              >
+                                <div>
+                                  <div
+                                    className="mb-2  d-flex align-items-center row"
+                                  >
+                                    <div
+                                      className="col-lg-9 col-9"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div>
+                                          <label
+                                            className="form-label"
+                                            htmlFor="root_0_0"
+                                          >
+                                            *
+                                          </label>
+                                          <input
+                                            aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                            autoFocus={false}
+                                            className="form-control"
+                                            disabled={false}
+                                            id="root_0_0"
+                                            name="root[0][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="a"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="py-4 col-lg-3 col-3"
+                                    >
+                                      <div
+                                        className="d-flex flex-row"
+                                      >
+                                        <button
+                                          className="btn btn-light btn-sm"
+                                          disabled={true}
+                                          id="root_0_0__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={false}
+                                          id="root_0_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_0_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"
+                                          >
+                                            <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="mb-2  d-flex align-items-center row"
+                                  >
+                                    <div
+                                      className="col-lg-9 col-9"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div>
+                                          <label
+                                            className="form-label"
+                                            htmlFor="root_0_1"
+                                          >
+                                            *
+                                          </label>
+                                          <input
+                                            aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                            autoFocus={false}
+                                            className="form-control"
+                                            disabled={false}
+                                            id="root_0_1"
+                                            name="root[0][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="b"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="py-4 col-lg-3 col-3"
+                                    >
+                                      <div
+                                        className="d-flex flex-row"
+                                      >
+                                        <button
+                                          className="btn btn-light btn-sm"
+                                          disabled={false}
+                                          id="root_0_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_0_1__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_0_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"
+                                            />
+                                          </svg>
+                                        </button>
+                                      </div>
+                                    </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_0__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>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={true}
+                        id="root_0__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={false}
+                        id="root_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_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"
+                        >
+                          <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="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div>
+                        <div>
+                          <div
+                            className="p-0 m-0 row"
+                          >
+                            <div
+                              className="p-0 m-0 col"
+                            >
+                              <div
+                                className="p-0 m-0 container-fluid"
+                              >
+                                <div>
+                                  <div
+                                    className="mb-2  d-flex align-items-center row"
+                                  >
+                                    <div
+                                      className="col-lg-9 col-9"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div>
+                                          <label
+                                            className="form-label"
+                                            htmlFor="root_1_0"
+                                          >
+                                            *
+                                          </label>
+                                          <input
+                                            aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                            autoFocus={false}
+                                            className="form-control"
+                                            disabled={false}
+                                            id="root_1_0"
+                                            name="root[1][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="c"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="py-4 col-lg-3 col-3"
+                                    >
+                                      <div
+                                        className="d-flex flex-row"
+                                      >
+                                        <button
+                                          className="btn btn-light btn-sm"
+                                          disabled={true}
+                                          id="root_1_0__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={false}
+                                          id="root_1_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_1_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"
+                                          >
+                                            <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="mb-2  d-flex align-items-center row"
+                                  >
+                                    <div
+                                      className="col-lg-9 col-9"
+                                    >
+                                      <div
+                                        className="rjsf-field rjsf-field-string"
+                                      >
+                                        <div>
+                                          <label
+                                            className="form-label"
+                                            htmlFor="root_1_1"
+                                          >
+                                            *
+                                          </label>
+                                          <input
+                                            aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                            autoFocus={false}
+                                            className="form-control"
+                                            disabled={false}
+                                            id="root_1_1"
+                                            name="root[1][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            readOnly={false}
+                                            required={true}
+                                            type="text"
+                                            value="d"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="py-4 col-lg-3 col-3"
+                                    >
+                                      <div
+                                        className="d-flex flex-row"
+                                      >
+                                        <button
+                                          className="btn btn-light btn-sm"
+                                          disabled={false}
+                                          id="root_1_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_1_1__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_1_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"
+                                            />
+                                          </svg>
+                                        </button>
+                                      </div>
+                                    </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_1__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>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={false}
+                        id="root_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_1__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_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"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </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__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>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <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_0_name"
+                                  >
+                                    name
+                                  </label>
+                                  <input
+                                    aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_0_name"
+                                    name="root.0.name"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    type="text"
+                                    value="Item 1"
+                                  />
+                                </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_0_value"
+                                  >
+                                    value
+                                  </label>
+                                  <input
+                                    aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_0_value"
+                                    name="root.0.value"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    step="any"
+                                    type="number"
+                                    value={10}
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={true}
+                        id="root_0__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={false}
+                        id="root_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_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"
+                        >
+                          <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="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <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_1_name"
+                                  >
+                                    name
+                                  </label>
+                                  <input
+                                    aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_1_name"
+                                    name="root.1.name"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    type="text"
+                                    value="Item 2"
+                                  />
+                                </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_1_value"
+                                  >
+                                    value
+                                  </label>
+                                  <input
+                                    aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                    autoFocus={false}
+                                    className="form-control"
+                                    disabled={false}
+                                    id="root_1_value"
+                                    name="root.1.value"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    readOnly={false}
+                                    required={false}
+                                    step="any"
+                                    type="number"
+                                    value={20}
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={false}
+                        id="root_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_1__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_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"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </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__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>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div>
+      <div>
+        <div
+          className="p-0 m-0 row"
+        >
+          <div
+            className="p-0 m-0 col"
+          >
+            <div
+              className="p-0 m-0 container-fluid"
+            >
+              <div>
+                <div
+                  className="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_0"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_0__error root_0__description root_0__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_0"
+                          name="root.0"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="foo"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={true}
+                        id="root_0__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={false}
+                        id="root_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_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"
+                        >
+                          <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="mb-2  d-flex align-items-center row"
+                >
+                  <div
+                    className="col-lg-9 col-9"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-string"
+                    >
+                      <div>
+                        <label
+                          className="form-label"
+                          htmlFor="root_1"
+                        >
+                          *
+                        </label>
+                        <input
+                          aria-describedby="root_1__error root_1__description root_1__help"
+                          autoFocus={false}
+                          className="form-control"
+                          disabled={false}
+                          id="root_1"
+                          name="root.1"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onFocus={[Function]}
+                          placeholder=""
+                          readOnly={false}
+                          required={true}
+                          type="text"
+                          value="bar"
+                        />
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="py-4 col-lg-3 col-3"
+                  >
+                    <div
+                      className="d-flex flex-row"
+                    >
+                      <button
+                        className="btn btn-light btn-sm"
+                        disabled={false}
+                        id="root_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_1__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_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"
+                          />
+                        </svg>
+                      </button>
+                    </div>
+                  </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__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>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/react-bootstrap/test/__snapshots__/Form.test.tsx.snap b/packages/react-bootstrap/test/__snapshots__/Form.test.tsx.snap
index 83c439198b..3d9755ac1e 100644
--- a/packages/react-bootstrap/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/react-bootstrap/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,3281 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <div
+                        className="my-1"
+                        id="root_tasks__title"
+                      >
+                        <h5>
+                          tasks
+                        </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
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div>
+                                  <div
+                                    className="my-1"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5>
+                                      tasks-1
+                                    </h5>
+                                    <hr
+                                      className="border-0 bg-secondary mt-0"
+                                      style={
+                                        {
+                                          "height": "1px",
+                                        }
+                                      }
+                                    />
+                                  </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_tasks_0_title"
+                                            >
+                                              title
+                                            </label>
+                                            <input
+                                              aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                              autoFocus={false}
+                                              className="form-control"
+                                              disabled={false}
+                                              id="root_tasks_0_title"
+                                              name="root[tasks][0][title]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={false}
+                                              type="text"
+                                              value="Task 1"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="row"
+                                      style={
+                                        {
+                                          "marginBottom": "10px",
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="col-12"
+                                      >
+                                         
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div>
+                                            <div
+                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                              className=""
+                                            >
+                                              <div
+                                                className="form-check"
+                                              >
+                                                <input
+                                                  autoFocus={false}
+                                                  checked={false}
+                                                  className="form-check-input"
+                                                  disabled={false}
+                                                  id="root_tasks_0_done"
+                                                  name="root[tasks][0][done]"
+                                                  onBlur={[Function]}
+                                                  onChange={[Function]}
+                                                  onFocus={[Function]}
+                                                  required={false}
+                                                  type="checkbox"
+                                                />
+                                                <label
+                                                  className="form-check-label"
+                                                  htmlFor="root_tasks_0_done"
+                                                  title=""
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_tasks_0__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={false}
+                                  id="root_tasks_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_tasks_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"
+                                  >
+                                    <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="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div>
+                                  <div
+                                    className="my-1"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5>
+                                      tasks-2
+                                    </h5>
+                                    <hr
+                                      className="border-0 bg-secondary mt-0"
+                                      style={
+                                        {
+                                          "height": "1px",
+                                        }
+                                      }
+                                    />
+                                  </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_tasks_1_title"
+                                            >
+                                              title
+                                            </label>
+                                            <input
+                                              aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                              autoFocus={false}
+                                              className="form-control"
+                                              disabled={false}
+                                              id="root_tasks_1_title"
+                                              name="root[tasks][1][title]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={false}
+                                              type="text"
+                                              value="Task 2"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="row"
+                                      style={
+                                        {
+                                          "marginBottom": "10px",
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="col-12"
+                                      >
+                                         
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div>
+                                            <div
+                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                              className=""
+                                            >
+                                              <div
+                                                className="form-check"
+                                              >
+                                                <input
+                                                  autoFocus={false}
+                                                  checked={true}
+                                                  className="form-check-input"
+                                                  disabled={false}
+                                                  id="root_tasks_1_done"
+                                                  name="root[tasks][1][done]"
+                                                  onBlur={[Function]}
+                                                  onChange={[Function]}
+                                                  onFocus={[Function]}
+                                                  required={false}
+                                                  type="checkbox"
+                                                />
+                                                <label
+                                                  className="form-check-label"
+                                                  htmlFor="root_tasks_1_done"
+                                                  title=""
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={false}
+                                  id="root_tasks_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_tasks_1__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_tasks_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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_tasks__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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <div
+                        className="my-1"
+                        id="root_tags__title"
+                      >
+                        <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
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-string"
+                              >
+                                <div>
+                                  <label
+                                    className="form-label"
+                                    htmlFor="root_tags_0"
+                                  >
+                                    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="foo"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_tags_0__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={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"
+                                >
+                                  <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>
+                          <div
+                            className="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <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="bar"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <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"
+                                  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_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <label
+                  className="form-label"
+                  htmlFor="root_choices"
+                >
+                  choices
+                </label>
+                <div>
+                  <div
+                    className="bg-transparent border-0 form-check"
+                  >
+                    <input
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      autoFocus={false}
+                      checked={false}
+                      className="form-check-input"
+                      disabled={false}
+                      id="root_choices-0"
+                      name="root[choices][]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <label
+                      className="form-check-label"
+                      htmlFor="root_choices-0"
+                      title=""
+                    >
+                      foo
+                    </label>
+                  </div>
+                  <div
+                    className="bg-transparent border-0 form-check"
+                  >
+                    <input
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      autoFocus={false}
+                      checked={false}
+                      className="form-check-input"
+                      disabled={false}
+                      id="root_choices-1"
+                      name="root[choices][]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <label
+                      className="form-check-label"
+                      htmlFor="root_choices-1"
+                      title=""
+                    >
+                      bar
+                    </label>
+                  </div>
+                  <div
+                    className="bg-transparent border-0 form-check"
+                  >
+                    <input
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      autoFocus={false}
+                      checked={false}
+                      className="form-check-input"
+                      disabled={false}
+                      id="root_choices-2"
+                      name="root[choices][]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={false}
+                      type="checkbox"
+                    />
+                    <label
+                      className="form-check-label"
+                      htmlFor="root_choices-2"
+                      title=""
+                    >
+                      baz
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <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
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div>
+                          <label
+                            className="form-label"
+                            htmlFor="root_person_firstName"
+                          >
+                            firstName
+                          </label>
+                          <input
+                            aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                            autoFocus={false}
+                            className="form-control"
+                            disabled={false}
+                            id="root_person_firstName"
+                            name="root[person][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_person_lastName"
+                          >
+                            lastName
+                          </label>
+                          <input
+                            aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                            autoFocus={false}
+                            className="form-control"
+                            disabled={false}
+                            id="root_person_lastName"
+                            name="root[person][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-object"
+                      >
+                        <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
+                              className="row"
+                              style={
+                                {
+                                  "marginBottom": "10px",
+                                }
+                              }
+                            >
+                              <div
+                                className="col-12"
+                              >
+                                 
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <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>
+                                </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_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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div>
+                <label
+                  className="form-label"
+                  htmlFor="root_option"
+                >
+                  option
+                </label>
+                <div
+                  className="mb-0"
+                >
+                  <div
+                    className="form-check"
+                  >
+                    <input
+                      aria-describedby="root_option__error root_option__description root_option__help"
+                      checked={false}
+                      className="form-check-input"
+                      disabled={false}
+                      id="root_option-0"
+                      name="root[option]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={false}
+                      type="radio"
+                      value="0"
+                    />
+                    <label
+                      className="form-check-label"
+                      htmlFor="root_option-0"
+                      title=""
+                    >
+                      foo
+                    </label>
+                  </div>
+                  <div
+                    className="form-check"
+                  >
+                    <input
+                      aria-describedby="root_option__error root_option__description root_option__help"
+                      checked={false}
+                      className="form-check-input"
+                      disabled={false}
+                      id="root_option-1"
+                      name="root[option]"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      onFocus={[Function]}
+                      required={false}
+                      type="radio"
+                      value="1"
+                    />
+                    <label
+                      className="form-check-label"
+                      htmlFor="root_option-1"
+                      title=""
+                    >
+                      bar
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div>
+                <label
+                  className="form-label"
+                  htmlFor="root_color"
+                >
+                  color
+                </label>
+                <select
+                  aria-describedby="root_color__error root_color__description root_color__help"
+                  autoFocus={false}
+                  className="form-select"
+                  disabled={false}
+                  id="root_color"
+                  name="root[color]"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  value=""
+                >
+                  <option
+                    value=""
+                  />
+                  <option
+                    disabled={false}
+                    id="red"
+                    value="0"
+                  >
+                    red
+                  </option>
+                  <option
+                    disabled={false}
+                    id="green"
+                    value="1"
+                  >
+                    green
+                  </option>
+                  <option
+                    disabled={false}
+                    id="blue"
+                    value="2"
+                  >
+                    blue
+                  </option>
+                </select>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 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",
+            }
+          }
+        >
+          <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-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
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div>
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className=""
+                >
+                  <div
+                    className="form-check"
+                  >
+                    <input
+                      autoFocus={false}
+                      checked={false}
+                      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=""
+                    >
+                      active
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div>
+                <label
+                  className="form-label"
+                  htmlFor="root_description"
+                >
+                  description
+                </label>
+                <div
+                  className="input-group"
+                >
+                  <textarea
+                    aria-describedby="root_description__error root_description__description root_description__help"
+                    autoFocus={false}
+                    className="form-control"
+                    disabled={false}
+                    id="root_description"
+                    name="root[description]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    rows={5}
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <div
+                        className="my-1"
+                        id="root_tasks__title"
+                      >
+                        <h5>
+                          tasks
+                        </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
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div>
+                                  <div
+                                    className="my-1"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5>
+                                      tasks-1
+                                    </h5>
+                                    <hr
+                                      className="border-0 bg-secondary mt-0"
+                                      style={
+                                        {
+                                          "height": "1px",
+                                        }
+                                      }
+                                    />
+                                  </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_tasks_0_title"
+                                            >
+                                              title
+                                            </label>
+                                            <input
+                                              aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                              autoFocus={false}
+                                              className="form-control"
+                                              disabled={false}
+                                              id="root_tasks_0_title"
+                                              name="root.tasks.0.title"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={false}
+                                              type="text"
+                                              value="Task 1"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="row"
+                                      style={
+                                        {
+                                          "marginBottom": "10px",
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="col-12"
+                                      >
+                                         
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div>
+                                            <div
+                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                              className=""
+                                            >
+                                              <div
+                                                className="form-check"
+                                              >
+                                                <input
+                                                  autoFocus={false}
+                                                  checked={false}
+                                                  className="form-check-input"
+                                                  disabled={false}
+                                                  id="root_tasks_0_done"
+                                                  name="root.tasks.0.done"
+                                                  onBlur={[Function]}
+                                                  onChange={[Function]}
+                                                  onFocus={[Function]}
+                                                  required={false}
+                                                  type="checkbox"
+                                                />
+                                                <label
+                                                  className="form-check-label"
+                                                  htmlFor="root_tasks_0_done"
+                                                  title=""
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_tasks_0__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={false}
+                                  id="root_tasks_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_tasks_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"
+                                  >
+                                    <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="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div>
+                                  <div
+                                    className="my-1"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5>
+                                      tasks-2
+                                    </h5>
+                                    <hr
+                                      className="border-0 bg-secondary mt-0"
+                                      style={
+                                        {
+                                          "height": "1px",
+                                        }
+                                      }
+                                    />
+                                  </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_tasks_1_title"
+                                            >
+                                              title
+                                            </label>
+                                            <input
+                                              aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                              autoFocus={false}
+                                              className="form-control"
+                                              disabled={false}
+                                              id="root_tasks_1_title"
+                                              name="root.tasks.1.title"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={false}
+                                              type="text"
+                                              value="Task 2"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="row"
+                                      style={
+                                        {
+                                          "marginBottom": "10px",
+                                        }
+                                      }
+                                    >
+                                      <div
+                                        className="col-12"
+                                      >
+                                         
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div>
+                                            <div
+                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                              className=""
+                                            >
+                                              <div
+                                                className="form-check"
+                                              >
+                                                <input
+                                                  autoFocus={false}
+                                                  checked={true}
+                                                  className="form-check-input"
+                                                  disabled={false}
+                                                  id="root_tasks_1_done"
+                                                  name="root.tasks.1.done"
+                                                  onBlur={[Function]}
+                                                  onChange={[Function]}
+                                                  onFocus={[Function]}
+                                                  required={false}
+                                                  type="checkbox"
+                                                />
+                                                <label
+                                                  className="form-check-label"
+                                                  htmlFor="root_tasks_1_done"
+                                                  title=""
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={false}
+                                  id="root_tasks_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_tasks_1__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_tasks_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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_tasks__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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <div
+                        className="my-1"
+                        id="root_tags__title"
+                      >
+                        <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
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-string"
+                              >
+                                <div>
+                                  <label
+                                    className="form-label"
+                                    htmlFor="root_tags_0"
+                                  >
+                                    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="foo"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_tags_0__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={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"
+                                >
+                                  <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>
+                          <div
+                            className="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <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="bar"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <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"
+                                  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_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <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
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div>
+                          <label
+                            className="form-label"
+                            htmlFor="root_person_firstName"
+                          >
+                            firstName
+                          </label>
+                          <input
+                            aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                            autoFocus={false}
+                            className="form-control"
+                            disabled={false}
+                            id="root_person_firstName"
+                            name="root.person.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_person_lastName"
+                          >
+                            lastName
+                          </label>
+                          <input
+                            aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                            autoFocus={false}
+                            className="form-control"
+                            disabled={false}
+                            id="root_person_lastName"
+                            name="root.person.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-object"
+                      >
+                        <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
+                              className="row"
+                              style={
+                                {
+                                  "marginBottom": "10px",
+                                }
+                              }
+                            >
+                              <div
+                                className="col-12"
+                              >
+                                 
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <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>
+                                </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_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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-string"
+            >
+              <div>
+                <label
+                  className="form-label"
+                  htmlFor="root_color"
+                >
+                  color
+                </label>
+                <select
+                  aria-describedby="root_color__error root_color__description root_color__help"
+                  autoFocus={false}
+                  className="form-select"
+                  disabled={false}
+                  id="root_color"
+                  name="root.color"
+                  onBlur={[Function]}
+                  onChange={[Function]}
+                  onFocus={[Function]}
+                  required={false}
+                  value=""
+                >
+                  <option
+                    value=""
+                  />
+                  <option
+                    disabled={false}
+                    id="red"
+                    value="0"
+                  >
+                    red
+                  </option>
+                  <option
+                    disabled={false}
+                    id="green"
+                    value="1"
+                  >
+                    green
+                  </option>
+                  <option
+                    disabled={false}
+                    id="blue"
+                    value="2"
+                  >
+                    blue
+                  </option>
+                </select>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 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",
+            }
+          }
+        >
+          <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-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
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div>
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className=""
+                >
+                  <div
+                    className="form-check"
+                  >
+                    <input
+                      autoFocus={false}
+                      checked={false}
+                      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=""
+                    >
+                      active
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap b/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
index c5d6e823c8..b43be620c0 100644
--- a/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/react-bootstrap/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,2036 @@
 // 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"
+  >
+    <div>
+      <div
+        className="p-0 container-fluid"
+      >
+        <div
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <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
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <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>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <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
+                              className="row"
+                              style={
+                                {
+                                  "marginBottom": "10px",
+                                }
+                              }
+                            >
+                              <div
+                                className="col-12"
+                              >
+                                 
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <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>
+                                </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_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>
+                                </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_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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with 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",
+            }
+          }
+        >
+          <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
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-string row"
+            >
+              <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"
+              >
+                <div>
+                  <label
+                    className="form-label"
+                    htmlFor="root_customField"
+                  >
+                    customField
+                  </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]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    type="text"
+                    value="customValue"
+                  />
+                </div>
+              </div>
+              <div
+                className="py-4 d-grid gap-2 col-2"
+              >
+                <button
+                  className="btn btn-danger btn-sm"
+                  disabled={false}
+                  id="root_customField__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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 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",
+            }
+          }
+        >
+          <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="Alice"
+                />
+              </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={30}
+                />
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div>
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className=""
+                >
+                  <div
+                    className="form-check"
+                  >
+                    <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=""
+                    >
+                      active
+                    </label>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <div
+                        className="my-1"
+                        id="root_tags__title"
+                      >
+                        <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
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-string"
+                              >
+                                <div>
+                                  <label
+                                    className="form-label"
+                                    htmlFor="root_tags_0"
+                                  >
+                                    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"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_tags_0__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={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"
+                                >
+                                  <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>
+                          <div
+                            className="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <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"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <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"
+                                  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_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 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",
+            }
+          }
+        >
+          <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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 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",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <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
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <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>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="row"
+                    style={
+                      {
+                        "marginBottom": "10px",
+                      }
+                    }
+                  >
+                    <div
+                      className="col-12"
+                    >
+                       
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <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
+                              className="row"
+                              style={
+                                {
+                                  "marginBottom": "10px",
+                                }
+                              }
+                            >
+                              <div
+                                className="col-12"
+                              >
+                                 
+                                <div
+                                  className="rjsf-field rjsf-field-string"
+                                >
+                                  <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>
+                                </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_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>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 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",
+            }
+          }
+        >
+          <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="Test"
+                />
+              </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_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>
+            </div>
+          </div>
+        </div>
+        <div
+          className="row"
+          style={
+            {
+              "marginBottom": "10px",
+            }
+          }
+        >
+          <div
+            className="col-12"
+          >
+             
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div>
+                <div>
+                  <div
+                    className="p-0 m-0 row"
+                  >
+                    <div
+                      className="p-0 m-0 col"
+                    >
+                      <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"
+                      >
+                        <div>
+                          <div
+                            className="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-string"
+                              >
+                                <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>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <button
+                                  className="btn btn-light btn-sm"
+                                  disabled={true}
+                                  id="root_items_0__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={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"
+                                  >
+                                    <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"
+                                  >
+                                    <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="mb-2  d-flex align-items-center row"
+                          >
+                            <div
+                              className="col-lg-9 col-9"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-string"
+                              >
+                                <div>
+                                  <label
+                                    className="form-label"
+                                    htmlFor="root_items_1"
+                                  >
+                                    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"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="py-4 col-lg-3 col-3"
+                            >
+                              <div
+                                className="d-flex flex-row"
+                              >
+                                <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"
+                                  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_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"
+                                    />
+                                  </svg>
+                                </button>
+                              </div>
+                            </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>
+                </div>
+              </div>
+            </div>
+          </div>
+        </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"
+      >
+        <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>
+    </div>
+  </div>
+  <div>
+    <button
+      className="btn btn-primary"
+      disabled={false}
+      type="submit"
+    >
+      Submit
+    </button>
+  </div>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/semantic-ui/test/__snapshots__/Array.test.tsx.snap b/packages/semantic-ui/test/__snapshots__/Array.test.tsx.snap
index 643611c271..63841955c1 100644
--- a/packages/semantic-ui/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/semantic-ui/test/__snapshots__/Array.test.tsx.snap
@@ -788,6 +788,2139 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_0_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_0_name"
+                                name="root[0][name]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 1"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_0_value"
+                            >
+                              value
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_0_value"
+                                name="root[0][value]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={10}
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon disabled button rjsf-array-item-move-up"
+                      disabled={true}
+                      id="root_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_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_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_1_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_1_name"
+                                name="root[1][name]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 2"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_1_value"
+                            >
+                              value
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_1_value"
+                                name="root[1][value]"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={20}
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon button rjsf-array-item-move-up"
+                      id="root_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_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_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </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__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>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon disabled button rjsf-array-item-move-up"
+                      disabled={true}
+                      id="root_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_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_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon button rjsf-array-item-move-up"
+                      id="root_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_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_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </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__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>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="field"
+      >
+        <div
+          aria-describedby="root__error root__description root__help"
+          aria-disabled={false}
+          aria-expanded={false}
+          aria-multiselectable={true}
+          autoFocus={false}
+          className="ui fluid multiple selection scrolling dropdown"
+          id="root"
+          inverted="false"
+          name="root"
+          onBlur={[Function]}
+          onChange={[Function]}
+          onClick={[Function]}
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          onMouseDown={[Function]}
+          readOnly={false}
+          required={false}
+          role="listbox"
+          tabIndex={0}
+        >
+          <i
+            aria-hidden="true"
+            className="dropdown icon"
+            onClick={[Function]}
+          />
+          <div
+            className="menu transition"
+          >
+            <div
+              aria-checked={false}
+              aria-disabled={false}
+              aria-selected={true}
+              className="selected item"
+              onClick={[Function]}
+              role="option"
+              style={
+                {
+                  "pointerEvents": "all",
+                }
+              }
+            >
+              <span
+                className="text"
+              >
+                foo
+              </span>
+            </div>
+            <div
+              aria-checked={false}
+              aria-disabled={false}
+              aria-selected={false}
+              className="item"
+              onClick={[Function]}
+              role="option"
+              style={
+                {
+                  "pointerEvents": "all",
+                }
+              }
+            >
+              <span
+                className="text"
+              >
+                bar
+              </span>
+            </div>
+            <div
+              aria-checked={false}
+              aria-disabled={false}
+              aria-selected={false}
+              className="item"
+              onClick={[Function]}
+              role="option"
+              style={
+                {
+                  "pointerEvents": "all",
+                }
+              }
+            >
+              <span
+                className="text"
+              >
+                baz
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-fixed-items"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            type="text"
+                            value="text"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-number"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            step="any"
+                            type="number"
+                            value={42}
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-boolean"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="field"
+                      >
+                        <div
+                          className="ui checked checkbox"
+                          inverted="false"
+                          onBlur={[Function]}
+                          onChange={[Function]}
+                          onClick={[Function]}
+                          onFocus={[Function]}
+                          onMouseDown={[Function]}
+                          onMouseUp={[Function]}
+                        >
+                          <input
+                            aria-describedby="root_2__error root_2__description root_2__help"
+                            autoFocus={false}
+                            checked={true}
+                            className="hidden"
+                            disabled={false}
+                            id="root_2"
+                            name="root[2]"
+                            readOnly={true}
+                            required={false}
+                            tabIndex={0}
+                            type="checkbox"
+                          />
+                          <label
+                            htmlFor="root_2"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-array sortable-form-fields"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+                      >
+                        <div>
+                          <div
+                            className="row array-item-list"
+                          >
+                            <div
+                              className="rjsf-array-item"
+                            >
+                              <div
+                                className="ui grid"
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "grid",
+                                    "gridTemplateColumns": "1fr 150px",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="middle aligned sixteen wide column"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="grouped equal width fields"
+                                    >
+                                      <div
+                                        className="required field"
+                                      >
+                                        <div
+                                          className="ui fluid input"
+                                        >
+                                          <input
+                                            aria-describedby="root_0_0__error root_0_0__description root_0_0__help"
+                                            autoFocus={false}
+                                            disabled={false}
+                                            id="root_0_0"
+                                            name="root[0][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            required={true}
+                                            type="text"
+                                            value="a"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  className="column"
+                                >
+                                  <div
+                                    className="ui mini buttons"
+                                  >
+                                    <button
+                                      className="ui icon disabled button rjsf-array-item-move-up"
+                                      disabled={true}
+                                      id="root_0_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_0_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_0_0__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                    >
+                                      <i
+                                        aria-hidden="true"
+                                        className="trash icon"
+                                        onClick={[Function]}
+                                      />
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="rjsf-array-item"
+                            >
+                              <div
+                                className="ui grid"
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "grid",
+                                    "gridTemplateColumns": "1fr 150px",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="middle aligned sixteen wide column"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="grouped equal width fields"
+                                    >
+                                      <div
+                                        className="required field"
+                                      >
+                                        <div
+                                          className="ui fluid input"
+                                        >
+                                          <input
+                                            aria-describedby="root_0_1__error root_0_1__description root_0_1__help"
+                                            autoFocus={false}
+                                            disabled={false}
+                                            id="root_0_1"
+                                            name="root[0][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            required={true}
+                                            type="text"
+                                            value="b"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  className="column"
+                                >
+                                  <div
+                                    className="ui mini buttons"
+                                  >
+                                    <button
+                                      className="ui icon button rjsf-array-item-move-up"
+                                      id="root_0_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_0_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_0_1__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                    >
+                                      <i
+                                        aria-hidden="true"
+                                        className="trash icon"
+                                        onClick={[Function]}
+                                      />
+                                    </button>
+                                  </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_0__add"
+                              onClick={[Function]}
+                              title="Add Item"
+                            >
+                              <i
+                                aria-hidden="true"
+                                className="plus icon"
+                                onClick={[Function]}
+                              />
+                            </button>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon disabled button rjsf-array-item-move-up"
+                      disabled={true}
+                      id="root_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_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_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-array"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+                      >
+                        <div>
+                          <div
+                            className="row array-item-list"
+                          >
+                            <div
+                              className="rjsf-array-item"
+                            >
+                              <div
+                                className="ui grid"
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "grid",
+                                    "gridTemplateColumns": "1fr 150px",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="middle aligned sixteen wide column"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="grouped equal width fields"
+                                    >
+                                      <div
+                                        className="required field"
+                                      >
+                                        <div
+                                          className="ui fluid input"
+                                        >
+                                          <input
+                                            aria-describedby="root_1_0__error root_1_0__description root_1_0__help"
+                                            autoFocus={false}
+                                            disabled={false}
+                                            id="root_1_0"
+                                            name="root[1][0]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            required={true}
+                                            type="text"
+                                            value="c"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  className="column"
+                                >
+                                  <div
+                                    className="ui mini buttons"
+                                  >
+                                    <button
+                                      className="ui icon disabled button rjsf-array-item-move-up"
+                                      disabled={true}
+                                      id="root_1_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_1_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_1_0__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                    >
+                                      <i
+                                        aria-hidden="true"
+                                        className="trash icon"
+                                        onClick={[Function]}
+                                      />
+                                    </button>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="rjsf-array-item"
+                            >
+                              <div
+                                className="ui grid"
+                                style={
+                                  {
+                                    "alignItems": "center",
+                                    "display": "grid",
+                                    "gridTemplateColumns": "1fr 150px",
+                                  }
+                                }
+                              >
+                                <div
+                                  className="middle aligned sixteen wide column"
+                                >
+                                  <div
+                                    className="rjsf-field rjsf-field-string"
+                                  >
+                                    <div
+                                      className="grouped equal width fields"
+                                    >
+                                      <div
+                                        className="required field"
+                                      >
+                                        <div
+                                          className="ui fluid input"
+                                        >
+                                          <input
+                                            aria-describedby="root_1_1__error root_1_1__description root_1_1__help"
+                                            autoFocus={false}
+                                            disabled={false}
+                                            id="root_1_1"
+                                            name="root[1][1]"
+                                            onBlur={[Function]}
+                                            onChange={[Function]}
+                                            onFocus={[Function]}
+                                            placeholder=""
+                                            required={true}
+                                            type="text"
+                                            value="d"
+                                          />
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                                <div
+                                  className="column"
+                                >
+                                  <div
+                                    className="ui mini buttons"
+                                  >
+                                    <button
+                                      className="ui icon button rjsf-array-item-move-up"
+                                      id="root_1_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_1_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_1_1__remove"
+                                      onClick={[Function]}
+                                      title="Remove"
+                                    >
+                                      <i
+                                        aria-hidden="true"
+                                        className="trash icon"
+                                        onClick={[Function]}
+                                      />
+                                    </button>
+                                  </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_1__add"
+                              onClick={[Function]}
+                              title="Add Item"
+                            >
+                              <i
+                                aria-hidden="true"
+                                className="plus icon"
+                                onClick={[Function]}
+                              />
+                            </button>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon button rjsf-array-item-move-up"
+                      id="root_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_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_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </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__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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_0_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_0_name__error root_0_name__description root_0_name__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_0_name"
+                                name="root.0.name"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 1"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_0_value"
+                            >
+                              value
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_0_value__error root_0_value__description root_0_value__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_0_value"
+                                name="root.0.value"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={10}
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon disabled button rjsf-array-item-move-up"
+                      disabled={true}
+                      id="root_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_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_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-object"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_1_name"
+                            >
+                              name
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_1_name__error root_1_name__description root_1_name__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_1_name"
+                                name="root.1.name"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                type="text"
+                                value="Item 2"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                      <div
+                        className="rjsf-field rjsf-field-number"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="field"
+                          >
+                            <label
+                              htmlFor="root_1_value"
+                            >
+                              value
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <input
+                                aria-describedby="root_1_value__error root_1_value__description root_1_value__help"
+                                autoFocus={false}
+                                disabled={false}
+                                id="root_1_value"
+                                name="root.1.value"
+                                onBlur={[Function]}
+                                onChange={[Function]}
+                                onFocus={[Function]}
+                                placeholder=""
+                                required={false}
+                                step="any"
+                                type="number"
+                                value={20}
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon button rjsf-array-item-move-up"
+                      id="root_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_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_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </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__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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+      >
+        <div>
+          <div
+            className="row array-item-list"
+          >
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_0__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_0"
+                            name="root.0"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon disabled button rjsf-array-item-move-up"
+                      disabled={true}
+                      id="root_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_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_0__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="rjsf-array-item"
+            >
+              <div
+                className="ui grid"
+                style={
+                  {
+                    "alignItems": "center",
+                    "display": "grid",
+                    "gridTemplateColumns": "1fr 150px",
+                  }
+                }
+              >
+                <div
+                  className="middle aligned sixteen wide column"
+                >
+                  <div
+                    className="rjsf-field rjsf-field-string"
+                  >
+                    <div
+                      className="grouped equal width fields"
+                    >
+                      <div
+                        className="required field"
+                      >
+                        <div
+                          className="ui fluid input"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_1__help"
+                            autoFocus={false}
+                            disabled={false}
+                            id="root_1"
+                            name="root.1"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="column"
+                >
+                  <div
+                    className="ui mini buttons"
+                  >
+                    <button
+                      className="ui icon button rjsf-array-item-move-up"
+                      id="root_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_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_1__remove"
+                      onClick={[Function]}
+                      title="Remove"
+                    >
+                      <i
+                        aria-hidden="true"
+                        className="trash icon"
+                        onClick={[Function]}
+                      />
+                    </button>
+                  </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__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>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="ui form rjsf"
diff --git a/packages/semantic-ui/test/__snapshots__/Form.test.tsx.snap b/packages/semantic-ui/test/__snapshots__/Form.test.tsx.snap
index 01ef1da13f..ae1e49d981 100644
--- a/packages/semantic-ui/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/semantic-ui/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,2564 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_tasks__title"
+            >
+              tasks
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <h5
+                            className="ui dividing header"
+                            id="root_tasks_0__title"
+                          >
+                            tasks-1
+                          </h5>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <label
+                                  htmlFor="root_tasks_0_title"
+                                >
+                                  title
+                                </label>
+                                <div
+                                  className="ui fluid input"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                    autoFocus={false}
+                                    disabled={false}
+                                    id="root_tasks_0_title"
+                                    name="root[tasks][0][title]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 1"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <div
+                                  className="ui checkbox"
+                                  inverted="false"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onClick={[Function]}
+                                  onFocus={[Function]}
+                                  onMouseDown={[Function]}
+                                  onMouseUp={[Function]}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    autoFocus={false}
+                                    checked={false}
+                                    className="hidden"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root[tasks][0][done]"
+                                    readOnly={true}
+                                    required={false}
+                                    tabIndex={0}
+                                    type="checkbox"
+                                  />
+                                  <label
+                                    htmlFor="root_tasks_0_done"
+                                  >
+                                    done
+                                  </label>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <button
+                          className="ui icon disabled button rjsf-array-item-move-up"
+                          disabled={true}
+                          id="root_tasks_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_tasks_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_tasks_0__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <h5
+                            className="ui dividing header"
+                            id="root_tasks_1__title"
+                          >
+                            tasks-2
+                          </h5>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <label
+                                  htmlFor="root_tasks_1_title"
+                                >
+                                  title
+                                </label>
+                                <div
+                                  className="ui fluid input"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                    autoFocus={false}
+                                    disabled={false}
+                                    id="root_tasks_1_title"
+                                    name="root[tasks][1][title]"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 2"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <div
+                                  className="ui checked checkbox"
+                                  inverted="false"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onClick={[Function]}
+                                  onFocus={[Function]}
+                                  onMouseDown={[Function]}
+                                  onMouseUp={[Function]}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    autoFocus={false}
+                                    checked={true}
+                                    className="hidden"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root[tasks][1][done]"
+                                    readOnly={true}
+                                    required={false}
+                                    tabIndex={0}
+                                    type="checkbox"
+                                  />
+                                  <label
+                                    htmlFor="root_tasks_1_done"
+                                  >
+                                    done
+                                  </label>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <button
+                          className="ui icon button rjsf-array-item-move-up"
+                          id="root_tasks_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_tasks_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_tasks_1__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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_tasks__add"
+                  onClick={[Function]}
+                  title="Add Item"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_tags__title"
+            >
+              tags
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_0"
+                            >
+                              tags-0
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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="foo"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_1"
+                            >
+                              tags-1
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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="bar"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <h5
+            className="ui dividing header"
+            id="root_choices__title"
+          >
+            choices
+          </h5>
+          <div
+            className="grouped fields"
+            id="root_choices"
+            name="root[choices][]"
+          >
+            <div
+              className="field"
+            >
+              <div
+                className="ui checkbox"
+                inverted="false"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onClick={[Function]}
+                onFocus={[Function]}
+                onMouseDown={[Function]}
+                onMouseUp={[Function]}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  className="hidden"
+                  disabled={false}
+                  id="root_choices-0"
+                  name="root[choices][]"
+                  readOnly={true}
+                  tabIndex={0}
+                  type="checkbox"
+                />
+                <label
+                  htmlFor="root_choices-0"
+                >
+                  foo
+                </label>
+              </div>
+            </div>
+            <div
+              className="field"
+            >
+              <div
+                className="ui checkbox"
+                inverted="false"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onClick={[Function]}
+                onFocus={[Function]}
+                onMouseDown={[Function]}
+                onMouseUp={[Function]}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  className="hidden"
+                  disabled={false}
+                  id="root_choices-1"
+                  name="root[choices][]"
+                  readOnly={true}
+                  tabIndex={0}
+                  type="checkbox"
+                />
+                <label
+                  htmlFor="root_choices-1"
+                >
+                  bar
+                </label>
+              </div>
+            </div>
+            <div
+              className="field"
+            >
+              <div
+                className="ui checkbox"
+                inverted="false"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onClick={[Function]}
+                onFocus={[Function]}
+                onMouseDown={[Function]}
+                onMouseUp={[Function]}
+              >
+                <input
+                  aria-describedby="root_choices__error root_choices__description root_choices__help"
+                  autoFocus={false}
+                  checked={false}
+                  className="hidden"
+                  disabled={false}
+                  id="root_choices-2"
+                  name="root[choices][]"
+                  readOnly={true}
+                  tabIndex={0}
+                  type="checkbox"
+                />
+                <label
+                  htmlFor="root_choices-2"
+                >
+                  baz
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <h5
+            className="ui dividing header"
+            id="root_person__title"
+          >
+            person
+          </h5>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <input
+                    aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                    autoFocus={false}
+                    disabled={false}
+                    id="root_person_firstName"
+                    name="root[person][firstName]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={false}
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_lastName"
+                >
+                  lastName
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <input
+                    aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                    autoFocus={false}
+                    disabled={false}
+                    id="root_person_lastName"
+                    name="root[person][lastName]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={false}
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <h5
+                className="ui dividing header"
+                id="root_person_address__title"
+              >
+                address
+              </h5>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_street"
+                    >
+                      street
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_city"
+                    >
+                      city
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="grouped fields"
+          >
+            <div
+              className="field"
+            >
+              <div
+                className="ui radio checkbox"
+                fluid={true}
+                inverted={false}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onClick={[Function]}
+                onFocus={[Function]}
+                onMouseDown={[Function]}
+                onMouseUp={[Function]}
+              >
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  checked={false}
+                  className="hidden"
+                  disabled={false}
+                  id="root_option-0"
+                  name="root[option]"
+                  readOnly={true}
+                  required={false}
+                  tabIndex={0}
+                  type="radio"
+                  value="0"
+                />
+                <label
+                  htmlFor="root_option-0"
+                >
+                  foo
+                </label>
+              </div>
+            </div>
+            <div
+              className="field"
+            >
+              <div
+                className="ui radio checkbox"
+                fluid={true}
+                inverted={false}
+                onBlur={[Function]}
+                onChange={[Function]}
+                onClick={[Function]}
+                onFocus={[Function]}
+                onMouseDown={[Function]}
+                onMouseUp={[Function]}
+              >
+                <input
+                  aria-describedby="root_option__error root_option__description root_option__help"
+                  checked={false}
+                  className="hidden"
+                  disabled={false}
+                  id="root_option-1"
+                  name="root[option]"
+                  readOnly={true}
+                  required={false}
+                  tabIndex={0}
+                  type="radio"
+                  value="1"
+                />
+                <label
+                  htmlFor="root_option-1"
+                >
+                  bar
+                </label>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_color"
+            >
+              color
+            </label>
+            <div
+              aria-describedby="root_color__error root_color__description root_color__help"
+              aria-disabled={false}
+              aria-expanded={false}
+              aria-multiselectable={false}
+              autoFocus={false}
+              className="ui fluid selection scrolling dropdown"
+              id="root_color"
+              inverted="false"
+              name="root[color]"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onKeyDown={[Function]}
+              onMouseDown={[Function]}
+              readOnly={false}
+              required={false}
+              role="listbox"
+              tabIndex={0}
+            >
+              <div
+                aria-atomic={true}
+                aria-live="polite"
+                className="divider text"
+                role="alert"
+              />
+              <i
+                aria-hidden="true"
+                className="dropdown icon"
+                onClick={[Function]}
+              />
+              <div
+                className="menu transition"
+              >
+                <div
+                  aria-checked={true}
+                  aria-selected={true}
+                  className="active selected item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  />
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    red
+                  </span>
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    green
+                  </span>
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    blue
+                  </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_firstName"
+            >
+              firstName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_age"
+            >
+              age
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <div
+              className="ui checkbox"
+              inverted="false"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onMouseDown={[Function]}
+              onMouseUp={[Function]}
+            >
+              <input
+                aria-describedby="root_active__error root_active__description root_active__help"
+                autoFocus={false}
+                checked={false}
+                className="hidden"
+                disabled={false}
+                id="root_active"
+                name="root[active]"
+                readOnly={true}
+                required={false}
+                tabIndex={0}
+                type="checkbox"
+              />
+              <label
+                htmlFor="root_active"
+              >
+                active
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_description"
+            >
+              description
+            </label>
+            <textarea
+              aria-describedby="root_description__error root_description__description root_description__help"
+              autoFocus={false}
+              disabled={false}
+              id="root_description"
+              inverted="false"
+              name="root[description]"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onFocus={[Function]}
+              onInput={[Function]}
+              placeholder=""
+              required={false}
+              rows={5}
+              value=""
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-object sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_tasks__title"
+            >
+              tasks
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <h5
+                            className="ui dividing header"
+                            id="root_tasks_0__title"
+                          >
+                            tasks-1
+                          </h5>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <label
+                                  htmlFor="root_tasks_0_title"
+                                >
+                                  title
+                                </label>
+                                <div
+                                  className="ui fluid input"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__help"
+                                    autoFocus={false}
+                                    disabled={false}
+                                    id="root_tasks_0_title"
+                                    name="root.tasks.0.title"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 1"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <div
+                                  className="ui checkbox"
+                                  inverted="false"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onClick={[Function]}
+                                  onFocus={[Function]}
+                                  onMouseDown={[Function]}
+                                  onMouseUp={[Function]}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                    autoFocus={false}
+                                    checked={false}
+                                    className="hidden"
+                                    disabled={false}
+                                    id="root_tasks_0_done"
+                                    name="root.tasks.0.done"
+                                    readOnly={true}
+                                    required={false}
+                                    tabIndex={0}
+                                    type="checkbox"
+                                  />
+                                  <label
+                                    htmlFor="root_tasks_0_done"
+                                  >
+                                    done
+                                  </label>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <button
+                          className="ui icon disabled button rjsf-array-item-move-up"
+                          disabled={true}
+                          id="root_tasks_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_tasks_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_tasks_0__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <h5
+                            className="ui dividing header"
+                            id="root_tasks_1__title"
+                          >
+                            tasks-2
+                          </h5>
+                          <div
+                            className="rjsf-field rjsf-field-string"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <label
+                                  htmlFor="root_tasks_1_title"
+                                >
+                                  title
+                                </label>
+                                <div
+                                  className="ui fluid input"
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__help"
+                                    autoFocus={false}
+                                    disabled={false}
+                                    id="root_tasks_1_title"
+                                    name="root.tasks.1.title"
+                                    onBlur={[Function]}
+                                    onChange={[Function]}
+                                    onFocus={[Function]}
+                                    placeholder=""
+                                    required={false}
+                                    type="text"
+                                    value="Task 2"
+                                  />
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className="rjsf-field rjsf-field-boolean"
+                          >
+                            <div
+                              className="grouped equal width fields"
+                            >
+                              <div
+                                className="field"
+                              >
+                                <div
+                                  className="ui checked checkbox"
+                                  inverted="false"
+                                  onBlur={[Function]}
+                                  onChange={[Function]}
+                                  onClick={[Function]}
+                                  onFocus={[Function]}
+                                  onMouseDown={[Function]}
+                                  onMouseUp={[Function]}
+                                >
+                                  <input
+                                    aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                    autoFocus={false}
+                                    checked={true}
+                                    className="hidden"
+                                    disabled={false}
+                                    id="root_tasks_1_done"
+                                    name="root.tasks.1.done"
+                                    readOnly={true}
+                                    required={false}
+                                    tabIndex={0}
+                                    type="checkbox"
+                                  />
+                                  <label
+                                    htmlFor="root_tasks_1_done"
+                                  >
+                                    done
+                                  </label>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <button
+                          className="ui icon button rjsf-array-item-move-up"
+                          id="root_tasks_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_tasks_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_tasks_1__remove"
+                          onClick={[Function]}
+                          title="Remove"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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_tasks__add"
+                  onClick={[Function]}
+                  title="Add Item"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_tags__title"
+            >
+              tags
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_0"
+                            >
+                              tags-0
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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="foo"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_1"
+                            >
+                              tags-1
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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="bar"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <h5
+            className="ui dividing header"
+            id="root_person__title"
+          >
+            person
+          </h5>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <input
+                    aria-describedby="root_person_firstName__error root_person_firstName__description root_person_firstName__help"
+                    autoFocus={false}
+                    disabled={false}
+                    id="root_person_firstName"
+                    name="root.person.firstName"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={false}
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_lastName"
+                >
+                  lastName
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <input
+                    aria-describedby="root_person_lastName__error root_person_lastName__description root_person_lastName__help"
+                    autoFocus={false}
+                    disabled={false}
+                    id="root_person_lastName"
+                    name="root.person.lastName"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    required={false}
+                    type="text"
+                    value=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <h5
+                className="ui dividing header"
+                id="root_person_address__title"
+              >
+                address
+              </h5>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_street"
+                    >
+                      street
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_city"
+                    >
+                      city
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_color"
+            >
+              color
+            </label>
+            <div
+              aria-describedby="root_color__error root_color__description root_color__help"
+              aria-disabled={false}
+              aria-expanded={false}
+              aria-multiselectable={false}
+              autoFocus={false}
+              className="ui fluid selection scrolling dropdown"
+              id="root_color"
+              inverted="false"
+              name="root.color"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onKeyDown={[Function]}
+              onMouseDown={[Function]}
+              readOnly={false}
+              required={false}
+              role="listbox"
+              tabIndex={0}
+            >
+              <div
+                aria-atomic={true}
+                aria-live="polite"
+                className="divider text"
+                role="alert"
+              />
+              <i
+                aria-hidden="true"
+                className="dropdown icon"
+                onClick={[Function]}
+              />
+              <div
+                className="menu transition"
+              >
+                <div
+                  aria-checked={true}
+                  aria-selected={true}
+                  className="active selected item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  />
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    red
+                  </span>
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    green
+                  </span>
+                </div>
+                <div
+                  aria-checked={false}
+                  aria-disabled={false}
+                  aria-selected={false}
+                  className="item"
+                  onClick={[Function]}
+                  role="option"
+                  style={
+                    {
+                      "pointerEvents": "all",
+                    }
+                  }
+                >
+                  <span
+                    className="text"
+                  >
+                    blue
+                  </span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_firstName"
+            >
+              firstName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_age"
+            >
+              age
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <div
+              className="ui checkbox"
+              inverted="false"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onMouseDown={[Function]}
+              onMouseUp={[Function]}
+            >
+              <input
+                aria-describedby="root_active__error root_active__description root_active__help"
+                autoFocus={false}
+                checked={false}
+                className="hidden"
+                disabled={false}
+                id="root_active"
+                name="root.active"
+                readOnly={true}
+                required={false}
+                tabIndex={0}
+                type="checkbox"
+              />
+              <label
+                htmlFor="root_active"
+              >
+                active
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
 exports[`semantic-ui specific tests field with special semantic options 1`] = `
 <form
   className="ui form rjsf"
diff --git a/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap b/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
index bc3508b191..ffaa4f12af 100644
--- a/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/semantic-ui/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,1523 @@
 // 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"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <h5
+            className="ui dividing header"
+            id="root_person__title"
+          >
+            person
+          </h5>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_name"
+                >
+                  name
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <h5
+                className="ui dividing header"
+                id="root_person_address__title"
+              >
+                address
+              </h5>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_street"
+                    >
+                      street
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_city"
+                    >
+                      city
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_country"
+                    >
+                      country
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_name"
+            >
+              name
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="ui equal width grid"
+        >
+          <div
+            className="row"
+          >
+            <div
+              className="column form-additional"
+            >
+              <div
+                className="grouped equal width fields"
+              >
+                <div
+                  className="field form-group"
+                >
+                  <label
+                    htmlFor="root_customField"
+                  >
+                    customField Key
+                  </label>
+                  <div
+                    className="ui fluid input"
+                    hasFeedback={true}
+                    htmlFor="root_customField"
+                  >
+                    <input
+                      aria-describedby={null}
+                      defaultValue="customField"
+                      disabled={false}
+                      id="root_customField"
+                      name="root_customField"
+                      onBlur={[Function]}
+                      onChange={[Function]}
+                      required={false}
+                      type="text"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="middle aligned column form-additional"
+            >
+              <div
+                className="grouped equal width fields"
+              >
+                <div
+                  className="field"
+                >
+                  <label
+                    htmlFor="root_customField"
+                  >
+                    customField
+                  </label>
+                  <div
+                    className="ui fluid input"
+                  >
+                    <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"
+                    />
+                  </div>
+                </div>
+              </div>
+            </div>
+            <div
+              className="column"
+            >
+              <button
+                className="ui mini icon button rjsf-object-property-remove"
+                id="root_customField__remove"
+                onClick={[Function]}
+                title="Remove"
+              >
+                <i
+                  aria-hidden="true"
+                  className="trash icon"
+                  onClick={[Function]}
+                />
+              </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_name"
+            >
+              name
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_age"
+            >
+              age
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-boolean"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <div
+              className="ui checked checkbox"
+              inverted="false"
+              onBlur={[Function]}
+              onChange={[Function]}
+              onClick={[Function]}
+              onFocus={[Function]}
+              onMouseDown={[Function]}
+              onMouseUp={[Function]}
+            >
+              <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"
+              >
+                active
+              </label>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_tags__title"
+            >
+              tags
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_0"
+                            >
+                              tags-0
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_tags_1"
+                            >
+                              tags-1
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_firstName"
+            >
+              firstName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_lastName"
+            >
+              lastName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_age"
+            >
+              age
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-object"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <h5
+            className="ui dividing header"
+            id="root_person__title"
+          >
+            person
+          </h5>
+          <div
+            className="rjsf-field rjsf-field-string"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <div
+                className="field"
+              >
+                <label
+                  htmlFor="root_person_name"
+                >
+                  name
+                </label>
+                <div
+                  className="ui fluid input"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+          <div
+            className="rjsf-field rjsf-field-object"
+          >
+            <div
+              className="grouped equal width fields"
+            >
+              <h5
+                className="ui dividing header"
+                id="root_person_address__title"
+              >
+                address
+              </h5>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_street"
+                    >
+                      street
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div
+                className="rjsf-field rjsf-field-string"
+              >
+                <div
+                  className="grouped equal width fields"
+                >
+                  <div
+                    className="field"
+                  >
+                    <label
+                      htmlFor="root_person_address_city"
+                    >
+                      city
+                    </label>
+                    <div
+                      className="ui fluid input"
+                    >
+                      <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=""
+                      />
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_name"
+            >
+              name
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_count"
+            >
+              count
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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}
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-array"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="rjsf-field rjsf-field-array rjsf-field-array-of-string sortable-form-fields"
+          >
+            <h5
+              className="ui dividing header"
+              id="root_items__title"
+            >
+              items
+            </h5>
+            <div>
+              <div
+                className="row array-item-list"
+              >
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_items_0"
+                            >
+                              items-0
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+                <div
+                  className="rjsf-array-item"
+                >
+                  <div
+                    className="ui grid"
+                    style={
+                      {
+                        "alignItems": "center",
+                        "display": "grid",
+                        "gridTemplateColumns": "1fr 150px",
+                      }
+                    }
+                  >
+                    <div
+                      className="middle aligned sixteen wide column"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-string"
+                      >
+                        <div
+                          className="grouped equal width fields"
+                        >
+                          <div
+                            className="required field"
+                          >
+                            <label
+                              htmlFor="root_items_1"
+                            >
+                              items-1
+                            </label>
+                            <div
+                              className="ui fluid input"
+                            >
+                              <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"
+                              />
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                    <div
+                      className="column"
+                    >
+                      <div
+                        className="ui mini buttons"
+                      >
+                        <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"
+                        >
+                          <i
+                            aria-hidden="true"
+                            className="trash icon"
+                            onClick={[Function]}
+                          />
+                        </button>
+                      </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"
+                >
+                  <i
+                    aria-hidden="true"
+                    className="plus icon"
+                    onClick={[Function]}
+                  />
+                </button>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<form
+  className="ui form rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="grouped equal width fields"
+    >
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_firstName"
+            >
+              firstName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-string"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_lastName"
+            >
+              lastName
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div
+        className="rjsf-field rjsf-field-number"
+      >
+        <div
+          className="grouped equal width fields"
+        >
+          <div
+            className="field"
+          >
+            <label
+              htmlFor="root_age"
+            >
+              age
+            </label>
+            <div
+              className="ui fluid input"
+            >
+              <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=""
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <button
+    className="ui primary button"
+    onClick={[Function]}
+    type="submit"
+  >
+    Submit
+  </button>
+</form>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="ui form rjsf"
diff --git a/packages/shadcn/test/__snapshots__/Array.test.tsx.snap b/packages/shadcn/test/__snapshots__/Array.test.tsx.snap
index ce67c1cc6c..432d7d6b31 100644
--- a/packages/shadcn/test/__snapshots__/Array.test.tsx.snap
+++ b/packages/shadcn/test/__snapshots__/Array.test.tsx.snap
@@ -1047,6 +1047,3123 @@ exports[`array fields no errors 1`] = `
 </form>
 `;
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div
+                          className="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_0_name"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_0_name__error root_0_name__description root_0_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_0_name"
+                                      name="root[0][name]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className=" flex"
+                          >
+                            <div
+                              className="w-full"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-number"
+                              >
+                                <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_0_value"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_0_value__error root_0_value__description root_0_value__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_0_value"
+                                      name="root[0][value]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div
+                          className="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_1_name"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_1_name__error root_1_name__description root_1_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_1_name"
+                                      name="root[1][name]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className=" flex"
+                          >
+                            <div
+                              className="w-full"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-number"
+                              >
+                                <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_1_value"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_1_value__error root_1_value__description root_1_value__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_1_value"
+                                      name="root[1][value]"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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
+                className="mt-2 flex"
+              >
+                <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-array-item-add"
+                    data-slot="button"
+                    disabled={false}
+                    id="root__add"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <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"
+                    >
+                      <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>
+    </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <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_0"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_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_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <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_1"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_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_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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
+                className="mt-2 flex"
+              >
+                <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-array-item-add"
+                    data-slot="button"
+                    disabled={false}
+                    id="root__add"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <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"
+                    >
+                      <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>
+    </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes with nameGenerator 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <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"
+      />
+      <div
+        className="p-0.5"
+      >
+        <div
+          aria-disabled={false}
+          autoFocus={false}
+          className="text-popover-foreground flex h-full w-full flex-col rounded-md overflow-visible bg-transparent"
+          cmdk-root=""
+          data-slot="command"
+          onBlur={[Function]}
+          onFocus={[Function]}
+          onKeyDown={[Function]}
+          tabIndex={-1}
+        >
+          <label
+            cmdk-label=""
+            htmlFor="radix-:rh:"
+            id="radix-:rg:"
+            style={
+              {
+                "borderWidth": "0",
+                "clip": "rect(0, 0, 0, 0)",
+                "height": "1px",
+                "margin": "-1px",
+                "overflow": "hidden",
+                "padding": "0",
+                "position": "absolute",
+                "whiteSpace": "nowrap",
+                "width": "1px",
+              }
+            }
+          />
+          <div
+            className="group border border-input px-3 py-2 text-sm ring-offset-background rounded-md focus-within:ring-1 focus-within:ring-ring focus-within:ring-offset-1"
+          >
+            <div
+              className="flex gap-1 flex-wrap"
+            >
+              <input
+                aria-autocomplete="list"
+                aria-controls="radix-:rf:"
+                aria-expanded={true}
+                aria-labelledby="radix-:rg:"
+                autoComplete="off"
+                autoCorrect="off"
+                className="rtl:mr-2 ltr:ml-2 bg-transparent outline-none placeholder:text-muted-foreground flex-1"
+                cmdk-input=""
+                disabled={false}
+                id="radix-:rh:"
+                onBlur={[Function]}
+                onChange={[Function]}
+                onFocus={[Function]}
+                placeholder="Select ..."
+                role="combobox"
+                spellCheck={false}
+                type="text"
+                value=""
+              />
+            </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator fixed array 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <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_0"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_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_0"
+                            name="root[0]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="text"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  />
+                </div>
+              </div>
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-number"
+                    >
+                      <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_1"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_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_1"
+                            name="root[1]"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            step="any"
+                            type="number"
+                            value={42}
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  />
+                </div>
+              </div>
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-boolean"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div
+                          aria-describedby="root_2__error root_2__description root_2__help"
+                          className="relative "
+                        >
+                          <div
+                            className="flex items-center gap-2 my-2"
+                          >
+                            <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_2"
+                              onBlur={[Function]}
+                              onClick={[Function]}
+                              onFocus={[Function]}
+                              onKeyDown={[Function]}
+                              role="checkbox"
+                              type="button"
+                              value="on"
+                            >
+                              <span
+                                className="flex items-center justify-center text-current transition-none"
+                                data-slot="checkbox-indicator"
+                                data-state="checked"
+                                style={
+                                  {
+                                    "pointerEvents": "none",
+                                  }
+                                }
+                              >
+                                <svg
+                                  className="size-3.5"
+                                  fill="none"
+                                  height="15"
+                                  viewBox="0 0 15 15"
+                                  width="15"
+                                  xmlns="http://www.w3.org/2000/svg"
+                                >
+                                  <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[2]"
+                              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_2"
+                              onMouseDown={[Function]}
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  />
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested arrays 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div>
+                          <div
+                            className="m-0 flex p-0"
+                          >
+                            <div
+                              className="m-0 w-full p-0"
+                            >
+                              <div
+                                className="p-0 m-0 w-full mb-2"
+                              >
+                                <div>
+                                  <div
+                                    className="mb-2 flex flex-row flex-wrap items-center"
+                                  >
+                                    <div
+                                      className="grow shrink"
+                                    >
+                                      <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_0_0"
+                                          >
+                                            *
+                                          </label>
+                                          <div
+                                            className="p-0.5"
+                                          >
+                                            <input
+                                              aria-describedby="root_0_0__error root_0_0__description root_0_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_0_0"
+                                              name="root[0][0]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={true}
+                                              type="text"
+                                              value="a"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="flex items-end justify-end p-0.5"
+                                    >
+                                      <div
+                                        className="flex gap-2"
+                                      >
+                                        <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_0_0__moveUp"
+                                          onClick={[Function]}
+                                          title="Move up"
+                                          type="button"
+                                        >
+                                          <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"
+                                          >
+                                            <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_0_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"
+                                          >
+                                            <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_0_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"
+                                          >
+                                            <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="mb-2 flex flex-row flex-wrap items-center"
+                                  >
+                                    <div
+                                      className="grow shrink"
+                                    >
+                                      <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_0_1"
+                                          >
+                                            *
+                                          </label>
+                                          <div
+                                            className="p-0.5"
+                                          >
+                                            <input
+                                              aria-describedby="root_0_1__error root_0_1__description root_0_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_0_1"
+                                              name="root[0][1]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={true}
+                                              type="text"
+                                              value="b"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="flex items-end justify-end p-0.5"
+                                    >
+                                      <div
+                                        className="flex gap-2"
+                                      >
+                                        <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_0_1__moveUp"
+                                          onClick={[Function]}
+                                          title="Move up"
+                                          type="button"
+                                        >
+                                          <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"
+                                          >
+                                            <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_0_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"
+                                          >
+                                            <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_0_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"
+                                          >
+                                            <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
+                                  className="mt-2 flex"
+                                >
+                                  <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-array-item-add"
+                                      data-slot="button"
+                                      disabled={false}
+                                      id="root_0__add"
+                                      onClick={[Function]}
+                                      type="button"
+                                    >
+                                      <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"
+                                      >
+                                        <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>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-array"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div>
+                          <div
+                            className="m-0 flex p-0"
+                          >
+                            <div
+                              className="m-0 w-full p-0"
+                            >
+                              <div
+                                className="p-0 m-0 w-full mb-2"
+                              >
+                                <div>
+                                  <div
+                                    className="mb-2 flex flex-row flex-wrap items-center"
+                                  >
+                                    <div
+                                      className="grow shrink"
+                                    >
+                                      <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_1_0"
+                                          >
+                                            *
+                                          </label>
+                                          <div
+                                            className="p-0.5"
+                                          >
+                                            <input
+                                              aria-describedby="root_1_0__error root_1_0__description root_1_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_1_0"
+                                              name="root[1][0]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={true}
+                                              type="text"
+                                              value="c"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="flex items-end justify-end p-0.5"
+                                    >
+                                      <div
+                                        className="flex gap-2"
+                                      >
+                                        <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_1_0__moveUp"
+                                          onClick={[Function]}
+                                          title="Move up"
+                                          type="button"
+                                        >
+                                          <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"
+                                          >
+                                            <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_1_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"
+                                          >
+                                            <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_1_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"
+                                          >
+                                            <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="mb-2 flex flex-row flex-wrap items-center"
+                                  >
+                                    <div
+                                      className="grow shrink"
+                                    >
+                                      <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_1_1"
+                                          >
+                                            *
+                                          </label>
+                                          <div
+                                            className="p-0.5"
+                                          >
+                                            <input
+                                              aria-describedby="root_1_1__error root_1_1__description root_1_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_1_1"
+                                              name="root[1][1]"
+                                              onBlur={[Function]}
+                                              onChange={[Function]}
+                                              onFocus={[Function]}
+                                              placeholder=""
+                                              readOnly={false}
+                                              required={true}
+                                              type="text"
+                                              value="d"
+                                            />
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className="flex items-end justify-end p-0.5"
+                                    >
+                                      <div
+                                        className="flex gap-2"
+                                      >
+                                        <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_1_1__moveUp"
+                                          onClick={[Function]}
+                                          title="Move up"
+                                          type="button"
+                                        >
+                                          <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"
+                                          >
+                                            <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_1_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"
+                                          >
+                                            <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_1_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"
+                                          >
+                                            <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
+                                  className="mt-2 flex"
+                                >
+                                  <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-array-item-add"
+                                      data-slot="button"
+                                      disabled={false}
+                                      id="root_1__add"
+                                      onClick={[Function]}
+                                      type="button"
+                                    >
+                                      <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"
+                                      >
+                                        <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>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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
+                className="mt-2 flex"
+              >
+                <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-array-item-add"
+                    data-slot="button"
+                    disabled={false}
+                    id="root__add"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <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"
+                    >
+                      <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>
+    </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div
+                          className="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_0_name"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_0_name__error root_0_name__description root_0_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_0_name"
+                                      name="root.0.name"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 1"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className=" flex"
+                          >
+                            <div
+                              className="w-full"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-number"
+                              >
+                                <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_0_value"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_0_value__error root_0_value__description root_0_value__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_0_value"
+                                      name="root.0.value"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={10}
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <div
+                      className="rjsf-field rjsf-field-object"
+                    >
+                      <div
+                        className="flex flex-col gap-2"
+                      >
+                        <div
+                          className="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_1_name"
+                                  >
+                                    name
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_1_name__error root_1_name__description root_1_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_1_name"
+                                      name="root.1.name"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      type="text"
+                                      value="Item 2"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                          <div
+                            className=" flex"
+                          >
+                            <div
+                              className="w-full"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-number"
+                              >
+                                <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_1_value"
+                                  >
+                                    value
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <input
+                                      aria-describedby="root_1_value__error root_1_value__description root_1_value__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_1_value"
+                                      name="root.1.value"
+                                      onBlur={[Function]}
+                                      onChange={[Function]}
+                                      onFocus={[Function]}
+                                      placeholder=""
+                                      readOnly={false}
+                                      required={false}
+                                      step="any"
+                                      type="number"
+                                      value={20}
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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
+                className="mt-2 flex"
+              >
+                <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-array-item-add"
+                    data-slot="button"
+                    disabled={false}
+                    id="root__add"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <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"
+                    >
+                      <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>
+    </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-array"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div>
+        <div
+          className="m-0 flex p-0"
+        >
+          <div
+            className="m-0 w-full p-0"
+          >
+            <div
+              className="p-0 m-0 w-full mb-2"
+            >
+              <div>
+                <div
+                  className="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <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_0"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_0__error root_0__description root_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_0"
+                            name="root.0"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="foo"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_0__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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="mb-2 flex flex-row flex-wrap items-center"
+                >
+                  <div
+                    className="grow shrink"
+                  >
+                    <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_1"
+                        >
+                          *
+                        </label>
+                        <div
+                          className="p-0.5"
+                        >
+                          <input
+                            aria-describedby="root_1__error root_1__description root_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_1"
+                            name="root.1"
+                            onBlur={[Function]}
+                            onChange={[Function]}
+                            onFocus={[Function]}
+                            placeholder=""
+                            readOnly={false}
+                            required={true}
+                            type="text"
+                            value="bar"
+                          />
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className="flex items-end justify-end p-0.5"
+                  >
+                    <div
+                      className="flex gap-2"
+                    >
+                      <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_1__moveUp"
+                        onClick={[Function]}
+                        title="Move up"
+                        type="button"
+                      >
+                        <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"
+                        >
+                          <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_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"
+                        >
+                          <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_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"
+                        >
+                          <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
+                className="mt-2 flex"
+              >
+                <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-array-item-add"
+                    data-slot="button"
+                    disabled={false}
+                    id="root__add"
+                    onClick={[Function]}
+                    type="button"
+                  >
+                    <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"
+                    >
+                      <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>
+    </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>
+`;
+
 exports[`with title and description array 1`] = `
 <form
   className="rjsf"
diff --git a/packages/shadcn/test/__snapshots__/Form.test.tsx.snap b/packages/shadcn/test/__snapshots__/Form.test.tsx.snap
index 9c09c96c92..39640d06f2 100644
--- a/packages/shadcn/test/__snapshots__/Form.test.tsx.snap
+++ b/packages/shadcn/test/__snapshots__/Form.test.tsx.snap
@@ -1,5 +1,3790 @@
 // Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing
 
+exports[`nameGenerator bracketNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_tasks__title"
+                      >
+                        <h5>
+                          tasks
+                        </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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div
+                                  className="flex flex-col gap-2"
+                                >
+                                  <div
+                                    className="my-1 flex flex-col gap-0.5"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5>
+                                      tasks-1
+                                    </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"
+                                  >
+                                    <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_tasks_0_title"
+                                            >
+                                              title
+                                            </label>
+                                            <div
+                                              className="p-0.5"
+                                            >
+                                              <input
+                                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__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_tasks_0_title"
+                                                name="root[tasks][0][title]"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 1"
+                                              />
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className=" flex"
+                                    >
+                                      <div
+                                        className="w-full"
+                                      >
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div
+                                            className="flex flex-col gap-2"
+                                          >
+                                            <div
+                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                              className="relative "
+                                            >
+                                              <div
+                                                className="flex items-center gap-2 my-2"
+                                              >
+                                                <button
+                                                  aria-checked={false}
+                                                  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="unchecked"
+                                                  disabled={false}
+                                                  id="root_tasks_0_done"
+                                                  onBlur={[Function]}
+                                                  onClick={[Function]}
+                                                  onFocus={[Function]}
+                                                  onKeyDown={[Function]}
+                                                  role="checkbox"
+                                                  type="button"
+                                                  value="on"
+                                                />
+                                                <input
+                                                  aria-hidden={true}
+                                                  defaultChecked={false}
+                                                  disabled={false}
+                                                  name="root[tasks][0][done]"
+                                                  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_tasks_0_done"
+                                                  onMouseDown={[Function]}
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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_tasks_0__moveUp"
+                                  onClick={[Function]}
+                                  title="Move up"
+                                  type="button"
+                                >
+                                  <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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div
+                                  className="flex flex-col gap-2"
+                                >
+                                  <div
+                                    className="my-1 flex flex-col gap-0.5"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5>
+                                      tasks-2
+                                    </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"
+                                  >
+                                    <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_tasks_1_title"
+                                            >
+                                              title
+                                            </label>
+                                            <div
+                                              className="p-0.5"
+                                            >
+                                              <input
+                                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__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_tasks_1_title"
+                                                name="root[tasks][1][title]"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 2"
+                                              />
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className=" flex"
+                                    >
+                                      <div
+                                        className="w-full"
+                                      >
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div
+                                            className="flex flex-col gap-2"
+                                          >
+                                            <div
+                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                              className="relative "
+                                            >
+                                              <div
+                                                className="flex items-center gap-2 my-2"
+                                              >
+                                                <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_tasks_1_done"
+                                                  onBlur={[Function]}
+                                                  onClick={[Function]}
+                                                  onFocus={[Function]}
+                                                  onKeyDown={[Function]}
+                                                  role="checkbox"
+                                                  type="button"
+                                                  value="on"
+                                                >
+                                                  <span
+                                                    className="flex items-center justify-center text-current transition-none"
+                                                    data-slot="checkbox-indicator"
+                                                    data-state="checked"
+                                                    style={
+                                                      {
+                                                        "pointerEvents": "none",
+                                                      }
+                                                    }
+                                                  >
+                                                    <svg
+                                                      className="size-3.5"
+                                                      fill="none"
+                                                      height="15"
+                                                      viewBox="0 0 15 15"
+                                                      width="15"
+                                                      xmlns="http://www.w3.org/2000/svg"
+                                                    >
+                                                      <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[tasks][1][done]"
+                                                  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_tasks_1_done"
+                                                  onMouseDown={[Function]}
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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_tasks_1__moveUp"
+                                  onClick={[Function]}
+                                  title="Move up"
+                                  type="button"
+                                >
+                                  <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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_tasks__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_tags__title"
+                      >
+                        <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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_0"
+                                  >
+                                    tags-1
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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="foo"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_1"
+                                  >
+                                    tags-2
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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="bar"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_tags__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator checkboxes field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <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_choices"
+                >
+                  choices
+                </label>
+                <div
+                  className="flex flex-col gap-2"
+                >
+                  <div
+                    className="flex items-center gap-2"
+                  >
+                    <button
+                      aria-checked={false}
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      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="unchecked"
+                      disabled={false}
+                      id="root_choices-0"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      role="checkbox"
+                      type="button"
+                      value="on"
+                    />
+                    <input
+                      aria-hidden={true}
+                      defaultChecked={false}
+                      disabled={false}
+                      name="root[choices][]"
+                      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_choices-0"
+                      onMouseDown={[Function]}
+                    >
+                      foo
+                    </label>
+                  </div>
+                  <div
+                    className="flex items-center gap-2"
+                  >
+                    <button
+                      aria-checked={false}
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      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="unchecked"
+                      disabled={false}
+                      id="root_choices-1"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      role="checkbox"
+                      type="button"
+                      value="on"
+                    />
+                    <input
+                      aria-hidden={true}
+                      defaultChecked={false}
+                      disabled={false}
+                      name="root[choices][]"
+                      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_choices-1"
+                      onMouseDown={[Function]}
+                    >
+                      bar
+                    </label>
+                  </div>
+                  <div
+                    className="flex items-center gap-2"
+                  >
+                    <button
+                      aria-checked={false}
+                      aria-describedby="root_choices__error root_choices__description root_choices__help"
+                      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="unchecked"
+                      disabled={false}
+                      id="root_choices-2"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      role="checkbox"
+                      type="button"
+                      value="on"
+                    />
+                    <input
+                      aria-hidden={true}
+                      defaultChecked={false}
+                      disabled={false}
+                      name="root[choices][]"
+                      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_choices-2"
+                      onMouseDown={[Function]}
+                    >
+                      baz
+                    </label>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  className="my-1 flex flex-col gap-0.5"
+                  id="root_person__title"
+                >
+                  <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"
+                >
+                  <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_person_firstName"
+                          >
+                            firstName
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <input
+                              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_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_person_firstName"
+                              name="root[person][firstName]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              readOnly={false}
+                              required={false}
+                              type="text"
+                              value=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <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_person_lastName"
+                          >
+                            lastName
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <input
+                              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_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_person_lastName"
+                              name="root[person][lastName]"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              readOnly={false}
+                              required={false}
+                              type="text"
+                              value=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className=" flex"
+                  >
+                    <div
+                      className="w-full"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="flex flex-col gap-2"
+                        >
+                          <div
+                            className="my-1 flex flex-col gap-0.5"
+                            id="root_person_address__title"
+                          >
+                            <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"
+                          >
+                            <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_person_address_street"
+                                    >
+                                      street
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <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_person_address_city"
+                                    >
+                                      city
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator radio field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_option"
+                >
+                  option
+                </label>
+                <div
+                  className="mb-0"
+                >
+                  <div
+                    aria-describedby="root_option__error root_option__description root_option__help"
+                    aria-orientation="vertical"
+                    aria-required={false}
+                    className="gap-3 flex flex-wrap flex-col"
+                    data-orientation="vertical"
+                    data-slot="radio-group"
+                    dir="ltr"
+                    onBlur={[Function]}
+                    onFocus={[Function]}
+                    onMouseDown={[Function]}
+                    role="radiogroup"
+                    style={
+                      {
+                        "outline": "none",
+                      }
+                    }
+                    tabIndex={0}
+                  >
+                    <div
+                      className="flex items-center gap-2"
+                    >
+                      <button
+                        aria-checked={false}
+                        className="border-input text-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 dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
+                        data-orientation="vertical"
+                        data-radix-collection-item=""
+                        data-slot="radio-group-item"
+                        data-state="unchecked"
+                        disabled={false}
+                        id="root_option-0"
+                        onClick={[Function]}
+                        onFocus={[Function]}
+                        onKeyDown={[Function]}
+                        onMouseDown={[Function]}
+                        role="radio"
+                        tabIndex={-1}
+                        type="button"
+                        value="0"
+                      />
+                      <input
+                        aria-hidden={true}
+                        defaultChecked={false}
+                        disabled={false}
+                        required={false}
+                        style={
+                          {
+                            "margin": 0,
+                            "opacity": 0,
+                            "pointerEvents": "none",
+                            "position": "absolute",
+                            "transform": "translateX(-100%)",
+                          }
+                        }
+                        tabIndex={-1}
+                        type="radio"
+                        value="0"
+                      />
+                      <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_option-0"
+                        onMouseDown={[Function]}
+                      >
+                        foo
+                      </label>
+                    </div>
+                    <div
+                      className="flex items-center gap-2"
+                    >
+                      <button
+                        aria-checked={false}
+                        className="border-input text-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 dark:bg-input/30 aspect-square size-4 shrink-0 rounded-full border shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50"
+                        data-orientation="vertical"
+                        data-radix-collection-item=""
+                        data-slot="radio-group-item"
+                        data-state="unchecked"
+                        disabled={false}
+                        id="root_option-1"
+                        onClick={[Function]}
+                        onFocus={[Function]}
+                        onKeyDown={[Function]}
+                        onMouseDown={[Function]}
+                        role="radio"
+                        tabIndex={-1}
+                        type="button"
+                        value="1"
+                      />
+                      <input
+                        aria-hidden={true}
+                        defaultChecked={false}
+                        disabled={false}
+                        required={false}
+                        style={
+                          {
+                            "margin": 0,
+                            "opacity": 0,
+                            "pointerEvents": "none",
+                            "position": "absolute",
+                            "transform": "translateX(-100%)",
+                          }
+                        }
+                        tabIndex={-1}
+                        type="radio"
+                        value="1"
+                      />
+                      <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_option-1"
+                        onMouseDown={[Function]}
+                      >
+                        bar
+                      </label>
+                    </div>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_color"
+                >
+                  color
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <div
+                    aria-describedby="root_color__error root_color__description root_color__help"
+                    aria-disabled={false}
+                    autoFocus={false}
+                    className="text-popover-foreground flex h-full w-full flex-col rounded-md overflow-visible bg-transparent"
+                    cmdk-root=""
+                    data-slot="command"
+                    onBlur={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    tabIndex={-1}
+                  >
+                    <label
+                      cmdk-label=""
+                      htmlFor="radix-:r1b:"
+                      id="radix-:r1a:"
+                      style={
+                        {
+                          "borderWidth": "0",
+                          "clip": "rect(0, 0, 0, 0)",
+                          "height": "1px",
+                          "margin": "-1px",
+                          "overflow": "hidden",
+                          "padding": "0",
+                          "position": "absolute",
+                          "whiteSpace": "nowrap",
+                          "width": "1px",
+                        }
+                      }
+                    />
+                    <div
+                      className="flex h-9 w-full items-center justify-between gap-2 whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
+                      onClick={[Function]}
+                    >
+                      <span
+                        className="flex-1 line-clamp-1 text-muted-foreground"
+                      />
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-chevron-down h-4 w-4 opacity-50"
+                        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="m6 9 6 6 6-6"
+                        />
+                      </svg>
+                    </div>
+                    <div
+                      className="relative"
+                    />
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_age"
+                >
+                  age
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className="relative "
+                >
+                  <div
+                    className="flex items-center gap-2 my-2"
+                  >
+                    <button
+                      aria-checked={false}
+                      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="unchecked"
+                      disabled={false}
+                      id="root_active"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      role="checkbox"
+                      type="button"
+                      value="on"
+                    />
+                    <input
+                      aria-hidden={true}
+                      defaultChecked={false}
+                      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>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator textarea field 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_description"
+                >
+                  description
+                </label>
+                <div
+                  className="flex p-0.5"
+                >
+                  <textarea
+                    aria-describedby="root_description__error root_description__description root_description__help"
+                    autoFocus={false}
+                    className="border-input placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 flex field-sizing-content min-h-16 w-full rounded-md border bg-transparent px-3 py-2 text-base shadow-xs transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 md:text-sm"
+                    data-slot="textarea"
+                    disabled={false}
+                    id="root_description"
+                    name="root[description]"
+                    onBlur={[Function]}
+                    onChange={[Function]}
+                    onFocus={[Function]}
+                    placeholder=""
+                    readOnly={false}
+                    required={false}
+                    rows={5}
+                    value=""
+                  />
+                </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of objects 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_tasks__title"
+                      >
+                        <h5>
+                          tasks
+                        </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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div
+                                  className="flex flex-col gap-2"
+                                >
+                                  <div
+                                    className="my-1 flex flex-col gap-0.5"
+                                    id="root_tasks_0__title"
+                                  >
+                                    <h5>
+                                      tasks-1
+                                    </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"
+                                  >
+                                    <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_tasks_0_title"
+                                            >
+                                              title
+                                            </label>
+                                            <div
+                                              className="p-0.5"
+                                            >
+                                              <input
+                                                aria-describedby="root_tasks_0_title__error root_tasks_0_title__description root_tasks_0_title__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_tasks_0_title"
+                                                name="root.tasks.0.title"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 1"
+                                              />
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className=" flex"
+                                    >
+                                      <div
+                                        className="w-full"
+                                      >
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div
+                                            className="flex flex-col gap-2"
+                                          >
+                                            <div
+                                              aria-describedby="root_tasks_0_done__error root_tasks_0_done__description root_tasks_0_done__help"
+                                              className="relative "
+                                            >
+                                              <div
+                                                className="flex items-center gap-2 my-2"
+                                              >
+                                                <button
+                                                  aria-checked={false}
+                                                  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="unchecked"
+                                                  disabled={false}
+                                                  id="root_tasks_0_done"
+                                                  onBlur={[Function]}
+                                                  onClick={[Function]}
+                                                  onFocus={[Function]}
+                                                  onKeyDown={[Function]}
+                                                  role="checkbox"
+                                                  type="button"
+                                                  value="on"
+                                                />
+                                                <input
+                                                  aria-hidden={true}
+                                                  defaultChecked={false}
+                                                  disabled={false}
+                                                  name="root.tasks.0.done"
+                                                  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_tasks_0_done"
+                                                  onMouseDown={[Function]}
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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_tasks_0__moveUp"
+                                  onClick={[Function]}
+                                  title="Move up"
+                                  type="button"
+                                >
+                                  <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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <div
+                                className="rjsf-field rjsf-field-object"
+                              >
+                                <div
+                                  className="flex flex-col gap-2"
+                                >
+                                  <div
+                                    className="my-1 flex flex-col gap-0.5"
+                                    id="root_tasks_1__title"
+                                  >
+                                    <h5>
+                                      tasks-2
+                                    </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"
+                                  >
+                                    <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_tasks_1_title"
+                                            >
+                                              title
+                                            </label>
+                                            <div
+                                              className="p-0.5"
+                                            >
+                                              <input
+                                                aria-describedby="root_tasks_1_title__error root_tasks_1_title__description root_tasks_1_title__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_tasks_1_title"
+                                                name="root.tasks.1.title"
+                                                onBlur={[Function]}
+                                                onChange={[Function]}
+                                                onFocus={[Function]}
+                                                placeholder=""
+                                                readOnly={false}
+                                                required={false}
+                                                type="text"
+                                                value="Task 2"
+                                              />
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                    <div
+                                      className=" flex"
+                                    >
+                                      <div
+                                        className="w-full"
+                                      >
+                                        <div
+                                          className="rjsf-field rjsf-field-boolean"
+                                        >
+                                          <div
+                                            className="flex flex-col gap-2"
+                                          >
+                                            <div
+                                              aria-describedby="root_tasks_1_done__error root_tasks_1_done__description root_tasks_1_done__help"
+                                              className="relative "
+                                            >
+                                              <div
+                                                className="flex items-center gap-2 my-2"
+                                              >
+                                                <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_tasks_1_done"
+                                                  onBlur={[Function]}
+                                                  onClick={[Function]}
+                                                  onFocus={[Function]}
+                                                  onKeyDown={[Function]}
+                                                  role="checkbox"
+                                                  type="button"
+                                                  value="on"
+                                                >
+                                                  <span
+                                                    className="flex items-center justify-center text-current transition-none"
+                                                    data-slot="checkbox-indicator"
+                                                    data-state="checked"
+                                                    style={
+                                                      {
+                                                        "pointerEvents": "none",
+                                                      }
+                                                    }
+                                                  >
+                                                    <svg
+                                                      className="size-3.5"
+                                                      fill="none"
+                                                      height="15"
+                                                      viewBox="0 0 15 15"
+                                                      width="15"
+                                                      xmlns="http://www.w3.org/2000/svg"
+                                                    >
+                                                      <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.tasks.1.done"
+                                                  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_tasks_1_done"
+                                                  onMouseDown={[Function]}
+                                                >
+                                                  done
+                                                </label>
+                                              </div>
+                                            </div>
+                                          </div>
+                                        </div>
+                                      </div>
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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_tasks_1__moveUp"
+                                  onClick={[Function]}
+                                  title="Move up"
+                                  type="button"
+                                >
+                                  <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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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_tasks_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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_tasks__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator array of strings 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_tags__title"
+                      >
+                        <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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_0"
+                                  >
+                                    tags-1
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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="foo"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_1"
+                                  >
+                                    tags-2
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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="bar"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_tags__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  className="my-1 flex flex-col gap-0.5"
+                  id="root_person__title"
+                >
+                  <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"
+                >
+                  <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_person_firstName"
+                          >
+                            firstName
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <input
+                              aria-describedby="root_person_firstName__error root_person_firstName__description root_person_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_person_firstName"
+                              name="root.person.firstName"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              readOnly={false}
+                              required={false}
+                              type="text"
+                              value=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <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_person_lastName"
+                          >
+                            lastName
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <input
+                              aria-describedby="root_person_lastName__error root_person_lastName__description root_person_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_person_lastName"
+                              name="root.person.lastName"
+                              onBlur={[Function]}
+                              onChange={[Function]}
+                              onFocus={[Function]}
+                              placeholder=""
+                              readOnly={false}
+                              required={false}
+                              type="text"
+                              value=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className=" flex"
+                  >
+                    <div
+                      className="w-full"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="flex flex-col gap-2"
+                        >
+                          <div
+                            className="my-1 flex flex-col gap-0.5"
+                            id="root_person_address__title"
+                          >
+                            <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"
+                          >
+                            <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_person_address_street"
+                                    >
+                                      street
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <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_person_address_city"
+                                    >
+                                      city
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator select field with enum 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_color"
+                >
+                  color
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <div
+                    aria-describedby="root_color__error root_color__description root_color__help"
+                    aria-disabled={false}
+                    autoFocus={false}
+                    className="text-popover-foreground flex h-full w-full flex-col rounded-md overflow-visible bg-transparent"
+                    cmdk-root=""
+                    data-slot="command"
+                    onBlur={[Function]}
+                    onFocus={[Function]}
+                    onKeyDown={[Function]}
+                    tabIndex={-1}
+                  >
+                    <label
+                      cmdk-label=""
+                      htmlFor="radix-:r1g:"
+                      id="radix-:r1f:"
+                      style={
+                        {
+                          "borderWidth": "0",
+                          "clip": "rect(0, 0, 0, 0)",
+                          "height": "1px",
+                          "margin": "-1px",
+                          "overflow": "hidden",
+                          "padding": "0",
+                          "position": "absolute",
+                          "whiteSpace": "nowrap",
+                          "width": "1px",
+                        }
+                      }
+                    />
+                    <div
+                      className="flex h-9 w-full items-center justify-between gap-2 whitespace-nowrap rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring disabled:cursor-not-allowed disabled:opacity-50"
+                      onClick={[Function]}
+                    >
+                      <span
+                        className="flex-1 line-clamp-1 text-muted-foreground"
+                      />
+                      <svg
+                        aria-hidden="true"
+                        className="lucide lucide-chevron-down h-4 w-4 opacity-50"
+                        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="m6 9 6 6 6-6"
+                        />
+                      </svg>
+                    </div>
+                    <div
+                      className="relative"
+                    />
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple fields 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_age"
+                >
+                  age
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className="relative "
+                >
+                  <div
+                    className="flex items-center gap-2 my-2"
+                  >
+                    <button
+                      aria-checked={false}
+                      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="unchecked"
+                      disabled={false}
+                      id="root_active"
+                      onBlur={[Function]}
+                      onClick={[Function]}
+                      onFocus={[Function]}
+                      onKeyDown={[Function]}
+                      role="checkbox"
+                      type="button"
+                      value="on"
+                    />
+                    <input
+                      aria-hidden={true}
+                      defaultChecked={false}
+                      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>
+                  </div>
+                </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>
+`;
+
 exports[`single fields checkbox field 1`] = `
 <form
   className="rjsf"
diff --git a/packages/shadcn/test/__snapshots__/Object.test.tsx.snap b/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
index dbb83c2dd9..1c544f5af7 100644
--- a/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
+++ b/packages/shadcn/test/__snapshots__/Object.test.tsx.snap
@@ -1,5 +1,2194 @@
 // 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"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  className="my-1 flex flex-col gap-0.5"
+                  id="root_person__title"
+                >
+                  <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"
+                >
+                  <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_person_name"
+                          >
+                            name
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <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=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className=" flex"
+                  >
+                    <div
+                      className="w-full"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="flex flex-col gap-2"
+                        >
+                          <div
+                            className="my-1 flex flex-col gap-0.5"
+                            id="root_person_address__title"
+                          >
+                            <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"
+                          >
+                            <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_person_address_street"
+                                    >
+                                      street
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <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_person_address_city"
+                                    >
+                                      city
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <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_person_address_country"
+                                    >
+                                      country
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with additionalProperties 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="flex flex-row items-center gap-2 relative w-full rjsf-field rjsf-field-string"
+            >
+              <div
+                className="flex flex-col w-full gap-2 line-clamp-1"
+              >
+                <div
+                  className="flex-grow"
+                >
+                  <label
+                    className="pt-2 text-sm font-medium text-muted-foreground mb-4 line-clamp-1"
+                    htmlFor="root_customField-key"
+                  >
+                    customField 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="customField"
+                      disabled={false}
+                      id="root_customField-key"
+                      name="root_customField-key"
+                      onBlur={[Function]}
+                      required={false}
+                      type="text"
+                    />
+                  </div>
+                </div>
+                <div
+                  className="flex-grow pr-0.5"
+                >
+                  <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_customField"
+                    >
+                      customField
+                    </label>
+                    <div
+                      className="p-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"
+                        data-slot="input"
+                        disabled={false}
+                        id="root_customField"
+                        name="root[customField]"
+                        onBlur={[Function]}
+                        onChange={[Function]}
+                        onFocus={[Function]}
+                        placeholder=""
+                        readOnly={false}
+                        required={false}
+                        type="text"
+                        value="customValue"
+                      />
+                    </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"
+                >
+                  <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"
+              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"
+            >
+              <circle
+                cx="12"
+                cy="12"
+                r="10"
+              />
+              <path
+                d="M8 12h8"
+              />
+              <path
+                d="M12 8v8"
+              />
+            </svg>
+             
+            Add Item
+          </button>
+        </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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="Alice"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_age"
+                >
+                  age
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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}
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-boolean"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  aria-describedby="root_active__error root_active__description root_active__help"
+                  className="relative "
+                >
+                  <div
+                    className="flex items-center gap-2 my-2"
+                  >
+                    <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"
+                    >
+                      <span
+                        className="flex items-center justify-center text-current transition-none"
+                        data-slot="checkbox-indicator"
+                        data-state="checked"
+                        style={
+                          {
+                            "pointerEvents": "none",
+                          }
+                        }
+                      >
+                        <svg
+                          className="size-3.5"
+                          fill="none"
+                          height="15"
+                          viewBox="0 0 15 15"
+                          width="15"
+                          xmlns="http://www.w3.org/2000/svg"
+                        >
+                          <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>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_tags__title"
+                      >
+                        <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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_0"
+                                  >
+                                    tags-1
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_tags_1"
+                                  >
+                                    tags-2
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_tags__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator bracketNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <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_lastName"
+                >
+                  lastName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_age"
+                >
+                  age
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator nested object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="flex flex-col gap-2"
+      >
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-object"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div
+                  className="my-1 flex flex-col gap-0.5"
+                  id="root_person__title"
+                >
+                  <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"
+                >
+                  <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_person_name"
+                          >
+                            name
+                          </label>
+                          <div
+                            className="p-0.5"
+                          >
+                            <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=""
+                            />
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div
+                    className=" flex"
+                  >
+                    <div
+                      className="w-full"
+                    >
+                      <div
+                        className="rjsf-field rjsf-field-object"
+                      >
+                        <div
+                          className="flex flex-col gap-2"
+                        >
+                          <div
+                            className="my-1 flex flex-col gap-0.5"
+                            id="root_person_address__title"
+                          >
+                            <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"
+                          >
+                            <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_person_address_street"
+                                    >
+                                      street
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <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_person_address_city"
+                                    >
+                                      city
+                                    </label>
+                                    <div
+                                      className="p-0.5"
+                                    >
+                                      <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=""
+                                      />
+                                    </div>
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator object with mixed types 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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="Test"
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_count"
+                >
+                  count
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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}
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-array"
+            >
+              <div
+                className="flex flex-col gap-2"
+              >
+                <div>
+                  <div
+                    className="m-0 flex p-0"
+                  >
+                    <div
+                      className="m-0 w-full p-0"
+                    >
+                      <div
+                        className="my-1 flex flex-col gap-0.5"
+                        id="root_items__title"
+                      >
+                        <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>
+                          <div
+                            className="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_items_0"
+                                  >
+                                    items-1
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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="mb-2 flex flex-row flex-wrap items-center"
+                          >
+                            <div
+                              className="grow shrink"
+                            >
+                              <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_items_1"
+                                  >
+                                    items-2
+                                    *
+                                  </label>
+                                  <div
+                                    className="p-0.5"
+                                  >
+                                    <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"
+                                    />
+                                  </div>
+                                </div>
+                              </div>
+                            </div>
+                            <div
+                              className="flex items-end justify-end p-0.5"
+                            >
+                              <div
+                                className="flex gap-2"
+                              >
+                                <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"
+                                >
+                                  <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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"
+                                  >
+                                    <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
+                          className="mt-2 flex"
+                        >
+                          <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-array-item-add"
+                              data-slot="button"
+                              disabled={false}
+                              id="root_items__add"
+                              onClick={[Function]}
+                              type="button"
+                            >
+                              <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"
+                              >
+                                <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>
+              </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>
+`;
+
+exports[`nameGenerator dotNotationNameGenerator simple object 1`] = `
+<form
+  className="rjsf"
+  noValidate={false}
+  onSubmit={[Function]}
+>
+  <div
+    className="rjsf-field rjsf-field-object"
+  >
+    <div
+      className="flex flex-col gap-2"
+    >
+      <div
+        className="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_firstName"
+                >
+                  firstName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <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_lastName"
+                >
+                  lastName
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div
+          className=" flex"
+        >
+          <div
+            className="w-full"
+          >
+            <div
+              className="rjsf-field rjsf-field-number"
+            >
+              <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_age"
+                >
+                  age
+                </label>
+                <div
+                  className="p-0.5"
+                >
+                  <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=""
+                  />
+                </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>
+`;
+
 exports[`object fields additionalProperties 1`] = `
 <form
   className="rjsf"
diff --git a/packages/snapshot-tests/src/arrayTests.tsx b/packages/snapshot-tests/src/arrayTests.tsx
index 614df7a87a..777ed2ff5c 100644
--- a/packages/snapshot-tests/src/arrayTests.tsx
+++ b/packages/snapshot-tests/src/arrayTests.tsx
@@ -1,7 +1,7 @@
 import { ComponentType } from 'react';
 import renderer, { TestRendererOptions } from 'react-test-renderer';
 import { FormProps } from '@rjsf/core';
-import { RJSFSchema, ErrorSchema, UiSchema } from '@rjsf/utils';
+import { RJSFSchema, ErrorSchema, UiSchema, bracketNameGenerator, dotNotationNameGenerator } from '@rjsf/utils';
 import validator from '@rjsf/validator-ajv8';
 
 jest.mock('@rjsf/utils', () => ({
@@ -389,4 +389,142 @@ export function arrayTests(Form: ComponentType<FormProps>, customOptions: ArrayR
       expect(tree).toMatchSnapshot();
     });
   });
+
+  describe('nameGenerator', () => {
+    describe('bracketNameGenerator', () => {
+      test('array of strings', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'string',
+          },
+        };
+        const formData = ['foo', 'bar'];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of objects', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'object',
+            properties: {
+              name: { type: 'string' },
+              value: { type: 'number' },
+            },
+          },
+        };
+        const formData = [
+          { name: 'Item 1', value: 10 },
+          { name: 'Item 2', value: 20 },
+        ];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('fixed array', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: [{ type: 'string' }, { type: 'number' }, { type: 'boolean' }],
+        };
+        const formData = ['text', 42, true];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('nested arrays', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'array',
+            items: {
+              type: 'string',
+            },
+          },
+        };
+        const formData = [
+          ['a', 'b'],
+          ['c', 'd'],
+        ];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('checkboxes with nameGenerator', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'string',
+            enum: ['foo', 'bar', 'baz'],
+          },
+          uniqueItems: true,
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />,
+            customOptions.checkboxes,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+
+    describe('dotNotationNameGenerator', () => {
+      test('array of strings', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'string',
+          },
+        };
+        const formData = ['foo', 'bar'];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of objects', () => {
+        const schema: RJSFSchema = {
+          type: 'array',
+          items: {
+            type: 'object',
+            properties: {
+              name: { type: 'string' },
+              value: { type: 'number' },
+            },
+          },
+        };
+        const formData = [
+          { name: 'Item 1', value: 10 },
+          { name: 'Item 2', value: 20 },
+        ];
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+  });
 }
diff --git a/packages/snapshot-tests/src/formTests.tsx b/packages/snapshot-tests/src/formTests.tsx
index 4f94f932b5..639252fc71 100644
--- a/packages/snapshot-tests/src/formTests.tsx
+++ b/packages/snapshot-tests/src/formTests.tsx
@@ -1,7 +1,14 @@
 import { ComponentType } from 'react';
 import renderer, { TestRendererOptions } from 'react-test-renderer';
 import { FormProps } from '@rjsf/core';
-import { RJSFSchema, ErrorSchema, UiSchema, Experimental_DefaultFormStateBehavior } from '@rjsf/utils';
+import {
+  RJSFSchema,
+  ErrorSchema,
+  UiSchema,
+  Experimental_DefaultFormStateBehavior,
+  bracketNameGenerator,
+  dotNotationNameGenerator,
+} from '@rjsf/utils';
 import validator from '@rjsf/validator-ajv8';
 
 jest.mock('@rjsf/utils', () => ({
@@ -773,4 +780,335 @@ export function formTests(Form: ComponentType<FormProps>, customOptions: FormRen
       });
     });
   });
+
+  describe('nameGenerator', () => {
+    describe('bracketNameGenerator', () => {
+      test('simple fields', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            firstName: {
+              type: 'string',
+            },
+            age: {
+              type: 'number',
+            },
+            active: {
+              type: 'boolean',
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('nested object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            person: {
+              type: 'object',
+              properties: {
+                firstName: {
+                  type: 'string',
+                },
+                lastName: {
+                  type: 'string',
+                },
+                address: {
+                  type: 'object',
+                  properties: {
+                    street: {
+                      type: 'string',
+                    },
+                    city: {
+                      type: 'string',
+                    },
+                  },
+                },
+              },
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of strings', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            tags: {
+              type: 'array',
+              items: {
+                type: 'string',
+              },
+            },
+          },
+        };
+        const formData = { tags: ['foo', 'bar'] };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of objects', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            tasks: {
+              type: 'array',
+              items: {
+                type: 'object',
+                properties: {
+                  title: {
+                    type: 'string',
+                  },
+                  done: {
+                    type: 'boolean',
+                  },
+                },
+              },
+            },
+          },
+        };
+        const formData = {
+          tasks: [
+            { title: 'Task 1', done: false },
+            { title: 'Task 2', done: true },
+          ],
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('select field with enum', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            color: {
+              type: 'string',
+              enum: ['red', 'green', 'blue'],
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('radio field', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            option: {
+              type: 'string',
+              enum: ['foo', 'bar'],
+            },
+          },
+        };
+        const uiSchema = {
+          option: {
+            'ui:widget': 'radio',
+          },
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} uiSchema={uiSchema} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('checkboxes field', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            choices: {
+              type: 'array',
+              items: {
+                type: 'string',
+                enum: ['foo', 'bar', 'baz'],
+              },
+              uniqueItems: true,
+            },
+          },
+        };
+        const uiSchema = {
+          choices: {
+            'ui:widget': 'checkboxes',
+          },
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} uiSchema={uiSchema} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('textarea field', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            description: {
+              type: 'string',
+            },
+          },
+        };
+        const uiSchema = {
+          description: {
+            'ui:widget': 'textarea',
+          },
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} uiSchema={uiSchema} validator={validator} nameGenerator={bracketNameGenerator} />,
+            customOptions[TEXTAREA_CUSTOMIZE],
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+
+    describe('dotNotationNameGenerator', () => {
+      test('simple fields', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            firstName: {
+              type: 'string',
+            },
+            age: {
+              type: 'number',
+            },
+            active: {
+              type: 'boolean',
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('nested object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            person: {
+              type: 'object',
+              properties: {
+                firstName: {
+                  type: 'string',
+                },
+                lastName: {
+                  type: 'string',
+                },
+                address: {
+                  type: 'object',
+                  properties: {
+                    street: {
+                      type: 'string',
+                    },
+                    city: {
+                      type: 'string',
+                    },
+                  },
+                },
+              },
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of strings', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            tags: {
+              type: 'array',
+              items: {
+                type: 'string',
+              },
+            },
+          },
+        };
+        const formData = { tags: ['foo', 'bar'] };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('array of objects', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            tasks: {
+              type: 'array',
+              items: {
+                type: 'object',
+                properties: {
+                  title: {
+                    type: 'string',
+                  },
+                  done: {
+                    type: 'boolean',
+                  },
+                },
+              },
+            },
+          },
+        };
+        const formData = {
+          tasks: [
+            { title: 'Task 1', done: false },
+            { title: 'Task 2', done: true },
+          ],
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('select field with enum', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            color: {
+              type: 'string',
+              enum: ['red', 'green', 'blue'],
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+  });
 }
diff --git a/packages/snapshot-tests/src/objectTests.tsx b/packages/snapshot-tests/src/objectTests.tsx
index ee8332b4e9..63e0811e6e 100644
--- a/packages/snapshot-tests/src/objectTests.tsx
+++ b/packages/snapshot-tests/src/objectTests.tsx
@@ -1,7 +1,7 @@
 import { ComponentType } from 'react';
 import renderer from 'react-test-renderer';
 import { FormProps } from '@rjsf/core';
-import { RJSFSchema, UiSchema } from '@rjsf/utils';
+import { RJSFSchema, UiSchema, bracketNameGenerator, dotNotationNameGenerator } from '@rjsf/utils';
 import validator from '@rjsf/validator-ajv8';
 
 jest.mock('@rjsf/utils', () => ({
@@ -202,4 +202,163 @@ export function objectTests(Form: ComponentType<FormProps>) {
       });
     });
   });
+
+  describe('nameGenerator', () => {
+    describe('bracketNameGenerator', () => {
+      test('simple object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            firstName: { type: 'string' },
+            lastName: { type: 'string' },
+            age: { type: 'number' },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('nested object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            person: {
+              type: 'object',
+              properties: {
+                name: { type: 'string' },
+                address: {
+                  type: 'object',
+                  properties: {
+                    street: { type: 'string' },
+                    city: { type: 'string' },
+                    country: { type: 'string' },
+                  },
+                },
+              },
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={bracketNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('object with additionalProperties', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            name: { type: 'string' },
+          },
+          additionalProperties: true,
+        };
+        const formData = {
+          name: 'John',
+          customField: 'customValue',
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('object with mixed types', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            name: { type: 'string' },
+            age: { type: 'number' },
+            active: { type: 'boolean' },
+            tags: {
+              type: 'array',
+              items: { type: 'string' },
+            },
+          },
+        };
+        const formData = {
+          name: 'Alice',
+          age: 30,
+          active: true,
+          tags: ['developer', 'designer'],
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={bracketNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+
+    describe('dotNotationNameGenerator', () => {
+      test('simple object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            firstName: { type: 'string' },
+            lastName: { type: 'string' },
+            age: { type: 'number' },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('nested object', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            person: {
+              type: 'object',
+              properties: {
+                name: { type: 'string' },
+                address: {
+                  type: 'object',
+                  properties: {
+                    street: { type: 'string' },
+                    city: { type: 'string' },
+                  },
+                },
+              },
+            },
+          },
+        };
+        const tree = renderer
+          .create(<Form schema={schema} validator={validator} nameGenerator={dotNotationNameGenerator} />)
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+
+      test('object with mixed types', () => {
+        const schema: RJSFSchema = {
+          type: 'object',
+          properties: {
+            name: { type: 'string' },
+            count: { type: 'number' },
+            items: {
+              type: 'array',
+              items: { type: 'string' },
+            },
+          },
+        };
+        const formData = {
+          name: 'Test',
+          count: 5,
+          items: ['a', 'b'],
+        };
+        const tree = renderer
+          .create(
+            <Form schema={schema} formData={formData} validator={validator} nameGenerator={dotNotationNameGenerator} />,
+          )
+          .toJSON();
+        expect(tree).toMatchSnapshot();
+      });
+    });
+  });
 }