// Jest Snapshot v1, https://jestjs.io/docs/snapshot-testing

exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
<DocumentFragment>
  <div
    class="mx_SearchBox mx_textinput"
  >
    <input
      autocomplete="off"
      class="mx_textinput_icon mx_textinput_search mx_SpaceHierarchy_search mx_textinput_icon mx_textinput_search"
      data-testid="searchbox-input"
      placeholder="Search names and descriptions"
      type="text"
      value=""
    />
    <div
      class="mx_AccessibleButton mx_SearchBox_closeButton"
      role="button"
      tabindex="-1"
    >
      <svg
        fill="currentColor"
        height="1em"
        viewBox="0 0 24 24"
        width="1em"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
        />
      </svg>
    </div>
  </div>
  <div
    class="mx_SpaceHierarchy_listHeader"
  >
    <h4
      class="mx_SpaceHierarchy_listHeader_header"
    >
      Rooms and spaces
    </h4>
    <div
      class="mx_SpaceHierarchy_listHeader_buttons"
    >
      <div
        aria-disabled="true"
        aria-label="Remove"
        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger_outline mx_AccessibleButton_disabled"
        disabled=""
        role="button"
        tabindex="0"
      >
        Remove
      </div>
      <div
        aria-disabled="true"
        aria-label="Mark as not suggested"
        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline mx_AccessibleButton_disabled"
        disabled=""
        role="button"
        tabindex="0"
      >
        Mark as not suggested
      </div>
    </div>
  </div>
  <ul
    aria-label="Space"
    class="mx_SpaceHierarchy_list"
    role="tree"
  >
    <li
      aria-labelledby="_r_8_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="0"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="5"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              U
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_8_"
            >
              Unnamed Room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            2 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="0"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_8_"
                    class="_input_153f2_18"
                    id="checkbox_MwbPDmfGtm"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
      </div>
    </li>
    <li
      aria-labelledby="_r_c_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="6"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              U
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_c_"
            >
              Unnamed Room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            3 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="-1"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_c_"
                    class="_input_153f2_18"
                    id="checkbox_GQvdMWe954"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
      </div>
    </li>
    <li
      aria-expanded="true"
      aria-labelledby="_r_g_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile mx_SpaceHierarchy_subspace"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="2"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              N
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_g_"
            >
              Nested space
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            1 member · 1 room
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="-1"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_g_"
                    class="_input_153f2_18"
                    id="checkbox_DVIAu5CsiH"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
        <div
          class="mx_SpaceHierarchy_subspace_toggle mx_SpaceHierarchy_subspace_toggle_shown"
        >
          <svg
            fill="currentColor"
            height="1em"
            viewBox="0 0 24 24"
            width="1em"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M12 14.95q-.2 0-.375-.062a.9.9 0 0 1-.325-.213l-4.6-4.6a.95.95 0 0 1-.275-.7q0-.425.275-.7a.95.95 0 0 1 .7-.275q.425 0 .7.275l3.9 3.9 3.9-3.9a.95.95 0 0 1 .7-.275q.425 0 .7.275a.95.95 0 0 1 .275.7.95.95 0 0 1-.275.7l-4.6 4.6q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
            />
          </svg>
        </div>
      </div>
      <div
        class="mx_SpaceHierarchy_subspace_children"
        role="group"
      />
    </li>
    <li
      aria-labelledby="_r_k_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="2"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              N
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_k_"
            >
              Nested room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            3 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="-1"
          >
            Join
          </div>
          <span
            aria-labelledby="_r_l_"
            tabindex="0"
          >
            <form
              class="_root_19upo_16"
            >
              <div
                class="_inline-field_19upo_32"
              >
                <div
                  class="_inline-field-control_19upo_44"
                >
                  <div
                    class="_container_153f2_10"
                  >
                    <input
                      aria-labelledby="_r_k_"
                      class="_input_153f2_18"
                      disabled=""
                      id="checkbox_RD7nyrA2oh"
                      role="presentation"
                      tabindex="-1"
                      type="checkbox"
                    />
                    <div
                      class="_ui_153f2_19"
                    >
                      <svg
                        aria-hidden="true"
                        fill="currentColor"
                        height="1em"
                        viewBox="0 0 24 24"
                        width="1em"
                        xmlns="http://www.w3.org/2000/svg"
                      >
                        <path
                          d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                        />
                      </svg>
                    </div>
                  </div>
                </div>
                <div
                  class="_inline-field-body_19upo_38"
                />
              </div>
            </form>
          </span>
        </div>
      </div>
    </li>
    <li
      aria-labelledby="_r_t_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="6"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              K
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_t_"
            >
              Knock room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            3 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
            role="button"
            tabindex="-1"
          >
            View
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_t_"
                    class="_input_153f2_18"
                    id="checkbox_jWVJIPauy1"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
      </div>
    </li>
  </ul>
</DocumentFragment>
`;

exports[`SpaceHierarchy <SpaceHierarchy /> should not render cycles 1`] = `
<DocumentFragment>
  <div
    class="mx_SearchBox mx_textinput"
  >
    <input
      autocomplete="off"
      class="mx_textinput_icon mx_textinput_search mx_SpaceHierarchy_search mx_textinput_icon mx_textinput_search"
      data-testid="searchbox-input"
      placeholder="Search names and descriptions"
      type="text"
      value=""
    />
    <div
      class="mx_AccessibleButton mx_SearchBox_closeButton"
      role="button"
      tabindex="-1"
    >
      <svg
        fill="currentColor"
        height="1em"
        viewBox="0 0 24 24"
        width="1em"
        xmlns="http://www.w3.org/2000/svg"
      >
        <path
          d="M6.293 6.293a1 1 0 0 1 1.414 0L12 10.586l4.293-4.293a1 1 0 1 1 1.414 1.414L13.414 12l4.293 4.293a1 1 0 0 1-1.414 1.414L12 13.414l-4.293 4.293a1 1 0 0 1-1.414-1.414L10.586 12 6.293 7.707a1 1 0 0 1 0-1.414"
        />
      </svg>
    </div>
  </div>
  <div
    class="mx_SpaceHierarchy_listHeader"
  >
    <h4
      class="mx_SpaceHierarchy_listHeader_header"
    >
      Rooms and spaces
    </h4>
    <div
      class="mx_SpaceHierarchy_listHeader_buttons"
    >
      <div
        aria-disabled="true"
        aria-label="Remove"
        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_danger_outline mx_AccessibleButton_disabled"
        disabled=""
        role="button"
        tabindex="0"
      >
        Remove
      </div>
      <div
        aria-disabled="true"
        aria-label="Mark as not suggested"
        class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline mx_AccessibleButton_disabled"
        disabled=""
        role="button"
        tabindex="0"
      >
        Mark as not suggested
      </div>
    </div>
  </div>
  <ul
    aria-label="Space"
    class="mx_SpaceHierarchy_list"
    role="tree"
  >
    <li
      aria-labelledby="_r_3i_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="0"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="5"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              U
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_3i_"
            >
              Unnamed Room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            2 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="0"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_3i_"
                    class="_input_153f2_18"
                    id="checkbox_EetmBG4yVC"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
      </div>
    </li>
    <li
      aria-labelledby="_r_3m_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="6"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              U
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_3m_"
            >
              Unnamed Room
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            3 members
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="-1"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_3m_"
                    class="_input_153f2_18"
                    id="checkbox_eEefiPqpMR"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
      </div>
    </li>
    <li
      aria-expanded="true"
      aria-labelledby="_r_3q_"
      class="mx_SpaceHierarchy_roomTileWrapper"
      role="treeitem"
    >
      <div
        class="mx_AccessibleButton mx_SpaceHierarchy_roomTile mx_SpaceHierarchy_subspace"
        role="button"
        tabindex="-1"
      >
        <div
          class="mx_SpaceHierarchy_roomTile_item"
        >
          <div
            class="mx_SpaceHierarchy_roomTile_avatar"
          >
            <span
              class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
              data-color="2"
              data-testid="avatar-img"
              data-type="round"
              role="presentation"
              style="--cpd-avatar-size: 20px;"
            >
              N
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_name"
          >
            <span
              id="_r_3q_"
            >
              Nested space
            </span>
          </div>
          <div
            class="mx_SpaceHierarchy_roomTile_info"
          >
            1 member · 0 rooms
          </div>
        </div>
        <div
          class="mx_SpaceHierarchy_actions"
        >
          <div
            class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary"
            role="button"
            tabindex="-1"
          >
            Join
          </div>
          <form
            class="_root_19upo_16"
          >
            <div
              class="_inline-field_19upo_32"
            >
              <div
                class="_inline-field-control_19upo_44"
              >
                <div
                  class="_container_153f2_10"
                >
                  <input
                    aria-labelledby="_r_3q_"
                    class="_input_153f2_18"
                    id="checkbox_MwbPDmfGtm"
                    role="presentation"
                    tabindex="-1"
                    type="checkbox"
                  />
                  <div
                    class="_ui_153f2_19"
                  >
                    <svg
                      aria-hidden="true"
                      fill="currentColor"
                      height="1em"
                      viewBox="0 0 24 24"
                      width="1em"
                      xmlns="http://www.w3.org/2000/svg"
                    >
                      <path
                        d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
                      />
                    </svg>
                  </div>
                </div>
              </div>
              <div
                class="_inline-field-body_19upo_38"
              />
            </div>
          </form>
        </div>
        <div
          class="mx_SpaceHierarchy_subspace_toggle mx_SpaceHierarchy_subspace_toggle_shown"
        >
          <svg
            fill="currentColor"
            height="1em"
            viewBox="0 0 24 24"
            width="1em"
            xmlns="http://www.w3.org/2000/svg"
          >
            <path
              d="M12 14.95q-.2 0-.375-.062a.9.9 0 0 1-.325-.213l-4.6-4.6a.95.95 0 0 1-.275-.7q0-.425.275-.7a.95.95 0 0 1 .7-.275q.425 0 .7.275l3.9 3.9 3.9-3.9a.95.95 0 0 1 .7-.275q.425 0 .7.275a.95.95 0 0 1 .275.7.95.95 0 0 1-.275.7l-4.6 4.6q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
            />
          </svg>
        </div>
      </div>
      <div
        class="mx_SpaceHierarchy_subspace_children"
        role="group"
      />
    </li>
  </ul>
</DocumentFragment>
`;