nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Refine styles of menus, toasts, popovers, and modals (#12332)

Browse Source 
* Refine styles of menus, toasts, popovers, and modals

This is a reintroduction of https://github.com/matrix-org/matrix-react-sdk/pull/12247, with the difference that modal styles have now been refreshed as well.

* Restore the fixed heights of some dialogs

* Fix formatting and flaky screenshot
This commit is contained in:
Robin
2024-03-13 09:38:32 -04:00
committed by GitHub
parent 0f251d8a55
commit 80c4c3c28c
65 changed files with 323 additions and 414 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
test/components/structures/__snapshots__/MatrixChat-test.tsx.snap
View File

@@ -325,7 +325,7 @@ exports[`<MatrixChat /> with an existing session onAction() room actions leave_r
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -333,13 +333,13 @@ exports[`<MatrixChat /> with an existing session onAction() room actions leave_r
>
Leave room
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"
@@ -381,7 +381,7 @@ exports[`<MatrixChat /> with an existing session onAction() room actions leave_r
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -389,13 +389,13 @@ exports[`<MatrixChat /> with an existing session onAction() room actions leave_r
>
Leave space
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

56
test/components/views/dialogs/__snapshots__/AppDownloadDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`AppDownloadDialog should allow disabling desktop build 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`AppDownloadDialog should allow disabling desktop build 1`] = `
>
Download Element
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AppDownloadDialog_mobile"
>
@@ -162,7 +162,7 @@ exports[`AppDownloadDialog should allow disabling fdroid build 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -170,13 +170,13 @@ exports[`AppDownloadDialog should allow disabling fdroid build 1`] = `
>
Download Element
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AppDownloadDialog_desktop"
>
@@ -318,7 +318,7 @@ exports[`AppDownloadDialog should allow disabling mobile builds 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -326,13 +326,13 @@ exports[`AppDownloadDialog should allow disabling mobile builds 1`] = `
>
Download Element
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AppDownloadDialog_desktop"
>
@@ -387,7 +387,7 @@ exports[`AppDownloadDialog should render with desktop, ios, android, fdroid butt
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -395,13 +395,13 @@ exports[`AppDownloadDialog should render with desktop, ios, android, fdroid butt
>
Download Element
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AppDownloadDialog_desktop"
>

14
test/components/views/dialogs/__snapshots__/ChangelogDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`<ChangelogDialog /> should fetch github proxy url for each repo with ol
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -23,13 +23,13 @@ exports[`<ChangelogDialog /> should fetch github proxy url for each repo with ol
>
Changelog
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

14
test/components/views/dialogs/__snapshots__/ConfirmUserActionDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`ConfirmUserActionDialog renders 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -23,13 +23,13 @@ exports[`ConfirmUserActionDialog renders 1`] = `
>
Ban this
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

14
test/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
>
Developer Tools
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_DevTools_label_left"
>

14
test/components/views/dialogs/__snapshots__/ExportDialog-test.tsx.snap
View File

@@ -9,7 +9,7 @@ exports[`<ExportDialog /> renders export dialog 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -17,13 +17,13 @@ exports[`<ExportDialog /> renders export dialog 1`] = `
>
Export Chat
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<p>
Select from the options below to export chats from your timeline
</p>

42
test/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`LogoutDialog Prompts user to connect backup if there is a backup on the
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -23,13 +23,13 @@ exports[`LogoutDialog Prompts user to connect backup if there is a backup on the
>
You'll lose access to your encrypted messages
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div>
<div
class="mx_Dialog_content"
@@ -102,7 +102,7 @@ exports[`LogoutDialog Prompts user to set up backup if there is no backup on the
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -110,13 +110,13 @@ exports[`LogoutDialog Prompts user to set up backup if there is no backup on the
>
You'll lose access to your encrypted messages
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div>
<div
class="mx_Dialog_content"
@@ -189,7 +189,7 @@ exports[`LogoutDialog shows a regular dialog when crypto is disabled 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -197,13 +197,13 @@ exports[`LogoutDialog shows a regular dialog when crypto is disabled 1`] = `
>
Sign out
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

28
test/components/views/dialogs/__snapshots__/ManageRestrictedJoinRuleDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`<ManageRestrictedJoinRuleDialog /> should list spaces which are not par
>
Select spaces
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<p>
<span>
Decide which spaces can access this room. If a space is selected, its members can find and join
@@ -164,7 +164,7 @@ exports[`<ManageRestrictedJoinRuleDialog /> should render empty state 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -172,13 +172,13 @@ exports[`<ManageRestrictedJoinRuleDialog /> should render empty state 1`] = `
>
Select spaces
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<p>
<span>
Decide which spaces can access this room. If a space is selected, its members can find and join

28
test/components/views/dialogs/__snapshots__/ManualDeviceKeyVerificationDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`ManualDeviceKeyVerificationDialog should display the device 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -23,13 +23,13 @@ exports[`ManualDeviceKeyVerificationDialog should display the device 1`] = `
>
Verify session
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"
@@ -130,7 +130,7 @@ exports[`ManualDeviceKeyVerificationDialog should display the device of another
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -138,13 +138,13 @@ exports[`ManualDeviceKeyVerificationDialog should display the device of another
>
Verify session
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

28
test/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`<MessageEditHistory /> should match the snapshot 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`<MessageEditHistory /> should match the snapshot 1`] = `
>
Message edits
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AutoHideScrollbar mx_ScrollPanel mx_MessageEditHistoryDialog_scrollPanel"
tabindex="-1"
@@ -130,7 +130,7 @@ exports[`<MessageEditHistory /> should support events with 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -138,13 +138,13 @@ exports[`<MessageEditHistory /> should support events with 1`] = `
>
Message edits
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AutoHideScrollbar mx_ScrollPanel mx_MessageEditHistoryDialog_scrollPanel"
tabindex="-1"

14
test/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -23,13 +23,13 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
>
Sign into your homeserver
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<form
class="mx_Dialog_content"
id="mx_ServerPickerDialog"

14
test/components/views/dialogs/security/__snapshots__/CreateKeyBackupDialog-test.tsx.snap
View File

@@ -121,7 +121,7 @@ exports[`CreateKeyBackupDialog should display the success dialog when the key ba
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -129,13 +129,13 @@ exports[`CreateKeyBackupDialog should display the success dialog when the key ba
>
Success!
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div>
<div>
<p>

14
test/components/views/dialogs/security/__snapshots__/ExportE2eKeysDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`ExportE2eKeysDialog renders 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`ExportE2eKeysDialog renders 1`] = `
>
Export room keys
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<form>
<div
class="mx_Dialog_content"

14
test/components/views/dialogs/security/__snapshots__/ImportE2eKeysDialog-test.tsx.snap
View File

@@ -14,7 +14,7 @@ exports[`ImportE2eKeysDialog renders 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -22,13 +22,13 @@ exports[`ImportE2eKeysDialog renders 1`] = `
>
Import room keys
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<form>
<div
class="mx_Dialog_content"

36
test/components/views/elements/__snapshots__/PollCreateDialog-test.tsx.snap
View File

@@ -20,13 +20,13 @@ exports[`PollCreateDialog renders a blank poll 1`] = `
<h1>
Create poll
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
<form
class="mx_CompoundDialog_form"
>
@@ -199,13 +199,13 @@ exports[`PollCreateDialog renders a question and some options 1`] = `
<h1>
Create poll
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
<form
class="mx_CompoundDialog_form"
>
@@ -402,13 +402,13 @@ exports[`PollCreateDialog renders info from a previous event 1`] = `
<h1>
Edit poll
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_CompoundDialog_cancelButton"
role="button"
tabindex="0"
/>
<form
class="mx_CompoundDialog_form"
>

28
test/components/views/settings/tabs/room/__snapshots__/SecurityRoomSettingsTab-test.tsx.snap
View File

@@ -119,7 +119,7 @@ exports[`<SecurityRoomSettingsTab /> join rule handles error when updating join
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -127,13 +127,13 @@ exports[`<SecurityRoomSettingsTab /> join rule handles error when updating join
>
Failed to update the join rules
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"
@@ -161,7 +161,7 @@ exports[`<SecurityRoomSettingsTab /> join rule warns when trying to make an encr
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -169,13 +169,13 @@ exports[`<SecurityRoomSettingsTab /> join rule warns when trying to make an encr
>
Are you sure you want to make this encrypted room public?
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_Dialog_content"
id="mx_Dialog_content"

14
test/components/views/spaces/__snapshots__/AddExistingToSpaceDialog-test.tsx.snap
View File

@@ -15,7 +15,7 @@ exports[`<AddExistingToSpaceDialog /> looks as expected 1`] = `
role="dialog"
>
<div
class="mx_Dialog_header mx_Dialog_headerWithCancel"
class="mx_Dialog_header"
>
<h1
class="mx_Heading_h3 mx_Dialog_title"
@@ -56,13 +56,13 @@ exports[`<AddExistingToSpaceDialog /> looks as expected 1`] = `
</div>
</div>
</h1>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
</div>
<div
aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button"
tabindex="0"
/>
<div
class="mx_AddExistingToSpace"
>