mirror of
https://github.com/vector-im/element-web.git
synced 2026-04-19 04:21:06 +02:00
Fix CSS module name collisions in shared-components Vitest (#33116)
This commit is contained in:
Zack
GitHub
parent
273a891b7b
commit
9e47271afe
@ -6,7 +6,7 @@ exports[`PlayPauseButton > renders the button in default state 1`] = `
|
||||
aria-disabled="false"
|
||||
aria-label="Play"
|
||||
aria-labelledby="_r_0_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
@ -38,7 +38,7 @@ exports[`PlayPauseButton > renders the button in playing state 1`] = `
|
||||
aria-disabled="false"
|
||||
aria-label="Pause"
|
||||
aria-labelledby="_r_6_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`Seekbar > renders the clock 1`] = `
|
||||
<div>
|
||||
<input
|
||||
aria-label="Audio seek bar"
|
||||
class="seekBar"
|
||||
class="SeekBar-module_seekBar"
|
||||
max="100"
|
||||
min="0"
|
||||
step="1"
|
||||
|
||||
@ -3,10 +3,10 @@
|
||||
exports[`AvatarWithDetails > renders a banner with an action 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -27,7 +27,7 @@ exports[`AvatarWithDetails > renders a banner with an action 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Alice's (
|
||||
@ -43,7 +43,7 @@ exports[`AvatarWithDetails > renders a banner with an action 1`] = `
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
@ -71,10 +71,10 @@ exports[`AvatarWithDetails > renders a banner with an action 1`] = `
|
||||
exports[`AvatarWithDetails > renders a banner with an avatar iamge 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<img
|
||||
alt="Example"
|
||||
@ -82,14 +82,14 @@ exports[`AvatarWithDetails > renders a banner with an avatar iamge 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Hello! This is a status banner.
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
@ -108,11 +108,11 @@ exports[`AvatarWithDetails > renders a banner with an avatar iamge 1`] = `
|
||||
exports[`AvatarWithDetails > renders a critical banner 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -128,14 +128,14 @@ exports[`AvatarWithDetails > renders a critical banner 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Hello! This is a status banner.
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
@ -154,10 +154,10 @@ exports[`AvatarWithDetails > renders a critical banner 1`] = `
|
||||
exports[`AvatarWithDetails > renders a default banner 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -178,14 +178,14 @@ exports[`AvatarWithDetails > renders a default banner 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Hello! This is a status banner.
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
@ -204,11 +204,11 @@ exports[`AvatarWithDetails > renders a default banner 1`] = `
|
||||
exports[`AvatarWithDetails > renders a info banner 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="info"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -229,14 +229,14 @@ exports[`AvatarWithDetails > renders a info banner 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Hello! This is a status banner.
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
@ -255,11 +255,11 @@ exports[`AvatarWithDetails > renders a info banner 1`] = `
|
||||
exports[`AvatarWithDetails > renders a success banner 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="success"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -275,14 +275,14 @@ exports[`AvatarWithDetails > renders a success banner 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p>
|
||||
Hello! This is a status banner.
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8"
|
||||
|
||||
@ -3,22 +3,22 @@
|
||||
exports[`AvatarWithDetails > renders a textual event 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="avatarWithDetails"
|
||||
class="AvatarWithDetails-module_avatarWithDetails"
|
||||
>
|
||||
<div
|
||||
style="width: 40px; height: 40px; background-color: rgb(136, 136, 136); border-radius: 50%;"
|
||||
/>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="title"
|
||||
class="AvatarWithDetails-module_title"
|
||||
>
|
||||
Room Name
|
||||
</span>
|
||||
<span
|
||||
class="details"
|
||||
class="AvatarWithDetails-module_details"
|
||||
>
|
||||
Details about the avatar go here
|
||||
</span>
|
||||
|
||||
@ -3,14 +3,14 @@
|
||||
exports[`Pill > renders the pill 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex pill"
|
||||
class="Flex-module_flex Pill-module_pill"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
style="width: 20px; height: 20px; border-radius: 100%; background-color: rgb(204, 204, 204);"
|
||||
/>
|
||||
<span
|
||||
class="label"
|
||||
class="Pill-module_label"
|
||||
id="_r_0_"
|
||||
>
|
||||
Pill
|
||||
@ -48,14 +48,14 @@ exports[`Pill > renders the pill 1`] = `
|
||||
exports[`Pill > renders the pill without close button 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex pill"
|
||||
class="Flex-module_flex Pill-module_pill"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
style="width: 20px; height: 20px; border-radius: 100%; background-color: rgb(204, 204, 204);"
|
||||
/>
|
||||
<span
|
||||
class="label"
|
||||
class="Pill-module_label"
|
||||
id="_r_1_"
|
||||
>
|
||||
Pill
|
||||
|
||||
@ -3,13 +3,13 @@
|
||||
exports[`PillInput > renders only the input without children 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex pillInput"
|
||||
class="Flex-module_flex PillInput-module_pillInput"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<input
|
||||
aria-label="pill input"
|
||||
autocomplete="off"
|
||||
class="input"
|
||||
class="PillInput-module_input"
|
||||
placeholder="Type something..."
|
||||
/>
|
||||
</div>
|
||||
@ -19,11 +19,11 @@ exports[`PillInput > renders only the input without children 1`] = `
|
||||
exports[`PillInput > renders the pill input 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex pillInput"
|
||||
class="Flex-module_flex PillInput-module_pillInput"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: wrap;"
|
||||
>
|
||||
<div
|
||||
@ -36,7 +36,7 @@ exports[`PillInput > renders the pill input 1`] = `
|
||||
<input
|
||||
aria-label="pill input"
|
||||
autocomplete="off"
|
||||
class="input largerInput"
|
||||
class="PillInput-module_input PillInput-module_largerInput"
|
||||
placeholder="Type something..."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@ -8,12 +8,12 @@ exports[`RichItem > renders the item in default state 1`] = `
|
||||
>
|
||||
<li
|
||||
aria-label="Rich Item Title"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -21,17 +21,17 @@ exports[`RichItem > renders the item in default state 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Rich Item Title
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
This is a description of the rich item.
|
||||
</span>
|
||||
<span
|
||||
class="timestamp"
|
||||
class="RichItem-module_timestamp"
|
||||
role="timer"
|
||||
>
|
||||
145 days ago
|
||||
@ -50,13 +50,13 @@ exports[`RichItem > renders the item in selected state 1`] = `
|
||||
<li
|
||||
aria-label="Rich Item Title"
|
||||
aria-selected="true"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="flex checkmark"
|
||||
class="Flex-module_flex RichItem-module_checkmark"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<svg
|
||||
@ -73,17 +73,17 @@ exports[`RichItem > renders the item in selected state 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Rich Item Title
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
This is a description of the rich item.
|
||||
</span>
|
||||
<span
|
||||
class="timestamp"
|
||||
class="RichItem-module_timestamp"
|
||||
role="timer"
|
||||
>
|
||||
145 days ago
|
||||
@ -101,12 +101,12 @@ exports[`RichItem > renders the item without timestamp 1`] = `
|
||||
>
|
||||
<li
|
||||
aria-label="Rich Item Title"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -114,12 +114,12 @@ exports[`RichItem > renders the item without timestamp 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Rich Item Title
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
This is a description of the rich item.
|
||||
</span>
|
||||
|
||||
@ -6,29 +6,29 @@ exports[`RichItem > renders the list 1`] = `
|
||||
style="height: 220px; overflow: hidden;"
|
||||
>
|
||||
<div
|
||||
class="flex richList"
|
||||
class="Flex-module_flex RichList-module_richList"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="title"
|
||||
class="RichList-module_title"
|
||||
id="_r_0_"
|
||||
>
|
||||
Rich List Title
|
||||
</span>
|
||||
<ul
|
||||
aria-labelledby="_r_0_"
|
||||
class="content"
|
||||
class="RichList-module_content"
|
||||
role="listbox"
|
||||
tabindex="0"
|
||||
>
|
||||
<li
|
||||
aria-label="First Item"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -36,12 +36,12 @@ exports[`RichItem > renders the list 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
First Item
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
description
|
||||
</span>
|
||||
@ -49,13 +49,13 @@ exports[`RichItem > renders the list 1`] = `
|
||||
<li
|
||||
aria-label="Second Item"
|
||||
aria-selected="true"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="flex checkmark"
|
||||
class="Flex-module_flex RichItem-module_checkmark"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<svg
|
||||
@ -72,24 +72,24 @@ exports[`RichItem > renders the list 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Second Item
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
description
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
aria-label="Third Item"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -97,24 +97,24 @@ exports[`RichItem > renders the list 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Third Item
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
description
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
aria-label="Fourth Item"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -122,24 +122,24 @@ exports[`RichItem > renders the list 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Fourth Item
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
description
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
aria-label="Fifth Item"
|
||||
class="richItem"
|
||||
class="RichItem-module_richItem"
|
||||
role="option"
|
||||
tabindex="-1"
|
||||
>
|
||||
<div
|
||||
class="flex avatar"
|
||||
class="Flex-module_flex RichItem-module_avatar"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -147,12 +147,12 @@ exports[`RichItem > renders the list 1`] = `
|
||||
/>
|
||||
</div>
|
||||
<span
|
||||
class="title"
|
||||
class="RichItem-module_title"
|
||||
>
|
||||
Fifth Item
|
||||
</span>
|
||||
<span
|
||||
class="description"
|
||||
class="RichItem-module_description"
|
||||
>
|
||||
description
|
||||
</span>
|
||||
@ -169,17 +169,17 @@ exports[`RichItem > renders the list with isEmpty=true 1`] = `
|
||||
style="height: 220px; overflow: hidden;"
|
||||
>
|
||||
<div
|
||||
class="flex richList"
|
||||
class="Flex-module_flex RichList-module_richList"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="title"
|
||||
class="RichList-module_title"
|
||||
id="_r_1_"
|
||||
>
|
||||
Rich List Title
|
||||
</span>
|
||||
<span
|
||||
class="empty"
|
||||
class="RichList-module_empty"
|
||||
>
|
||||
No items available
|
||||
</span>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`LinkedText > renders a custom href 1`] = `
|
||||
<div>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container"
|
||||
>
|
||||
I love working on
|
||||
<a
|
||||
@ -22,7 +22,7 @@ exports[`LinkedText > renders a custom href 1`] = `
|
||||
exports[`LinkedText > renders a custom target 1`] = `
|
||||
<div>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container"
|
||||
>
|
||||
I love working on
|
||||
<a
|
||||
@ -41,7 +41,7 @@ exports[`LinkedText > renders a custom target 1`] = `
|
||||
exports[`LinkedText > renders a room alias 1`] = `
|
||||
<div>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container"
|
||||
>
|
||||
I love talking in
|
||||
<a
|
||||
@ -60,7 +60,7 @@ exports[`LinkedText > renders a room alias 1`] = `
|
||||
exports[`LinkedText > renders a standard link 1`] = `
|
||||
<div>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container"
|
||||
>
|
||||
I love working on
|
||||
<a
|
||||
@ -79,7 +79,7 @@ exports[`LinkedText > renders a standard link 1`] = `
|
||||
exports[`LinkedText > renders a user ID 1`] = `
|
||||
<div>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container"
|
||||
>
|
||||
I love talking to
|
||||
<a
|
||||
|
||||
@ -3,109 +3,109 @@
|
||||
exports[`<SasEmoji/> > should match snapshot 1`] = `
|
||||
<DocumentFragment>
|
||||
<div
|
||||
class="container"
|
||||
class="SasEmoji-module_container"
|
||||
>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🦋
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Butterfly
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🍄
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Mushroom
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
⚽
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Ball
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🌏
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Globe
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🦄
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Unicorn
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🚀
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Rocket
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="segment"
|
||||
class="SasEmoji-module_segment"
|
||||
>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="emoji"
|
||||
class="SasEmoji-module_emoji"
|
||||
>
|
||||
🔧
|
||||
</div>
|
||||
<div
|
||||
class="label"
|
||||
class="SasEmoji-module_label"
|
||||
>
|
||||
Spanner
|
||||
</div>
|
||||
|
||||
@ -3,29 +3,29 @@
|
||||
exports[`LinkPreview > renders a preview 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -39,7 +39,7 @@ exports[`LinkPreview > renders a preview 1`] = `
|
||||
</span>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A simple description
|
||||
</p>
|
||||
@ -52,19 +52,19 @@ exports[`LinkPreview > renders a preview 1`] = `
|
||||
exports[`LinkPreview > renders a preview with just a title 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -81,19 +81,19 @@ exports[`LinkPreview > renders a preview with just a title 1`] = `
|
||||
exports[`LinkPreview > renders a preview with just a title and description 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -102,7 +102,7 @@ exports[`LinkPreview > renders a preview with just a title and description 1`] =
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A simple description with a link to
|
||||
<a
|
||||
|
||||
@ -3,35 +3,35 @@
|
||||
exports[`UrlPreviewGroupView > renders a single preview 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="wrapper"
|
||||
class="UrlPreviewGroupView-module_wrapper"
|
||||
>
|
||||
<div
|
||||
class="previewGroup"
|
||||
class="UrlPreviewGroupView-module_previewGroup"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -40,7 +40,7 @@ exports[`UrlPreviewGroupView > renders a single preview 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A simple description
|
||||
</p>
|
||||
@ -80,35 +80,35 @@ exports[`UrlPreviewGroupView > renders a single preview 1`] = `
|
||||
exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="wrapper"
|
||||
class="UrlPreviewGroupView-module_wrapper"
|
||||
>
|
||||
<div
|
||||
class="previewGroup"
|
||||
class="UrlPreviewGroupView-module_previewGroup"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -117,7 +117,7 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A regular square image.
|
||||
</p>
|
||||
@ -125,29 +125,29 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/tallImage.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -156,7 +156,7 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
This one has a taller image which should crop nicely.
|
||||
</p>
|
||||
@ -164,29 +164,29 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -195,7 +195,7 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
One more description
|
||||
</p>
|
||||
@ -203,7 +203,7 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="_button_13vu4_8 toggleButton"
|
||||
class="_button_13vu4_8 UrlPreviewGroupView-module_toggleButton"
|
||||
data-kind="tertiary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -244,35 +244,35 @@ exports[`UrlPreviewGroupView > renders multiple previews 1`] = `
|
||||
exports[`UrlPreviewGroupView > renders multiple previews which are hidden 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="wrapper"
|
||||
class="UrlPreviewGroupView-module_wrapper"
|
||||
>
|
||||
<div
|
||||
class="previewGroup"
|
||||
class="UrlPreviewGroupView-module_previewGroup"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -281,7 +281,7 @@ exports[`UrlPreviewGroupView > renders multiple previews which are hidden 1`] =
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A simple description
|
||||
</p>
|
||||
@ -289,7 +289,7 @@ exports[`UrlPreviewGroupView > renders multiple previews which are hidden 1`] =
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="_button_13vu4_8 toggleButton"
|
||||
class="_button_13vu4_8 UrlPreviewGroupView-module_toggleButton"
|
||||
data-kind="tertiary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -330,35 +330,35 @@ exports[`UrlPreviewGroupView > renders multiple previews which are hidden 1`] =
|
||||
exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="wrapper"
|
||||
class="UrlPreviewGroupView-module_wrapper"
|
||||
>
|
||||
<div
|
||||
class="previewGroup compactLayout"
|
||||
class="UrlPreviewGroupView-module_previewGroup UrlPreviewGroupView-module_compactLayout"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -367,7 +367,7 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
A regular square image.
|
||||
</p>
|
||||
@ -375,29 +375,29 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/tallImage.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -406,7 +406,7 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
This one has a taller image which should crop nicely.
|
||||
</p>
|
||||
@ -414,29 +414,29 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="container"
|
||||
class="LinkPreview-module_container"
|
||||
>
|
||||
<div
|
||||
class="wrapImageCaption"
|
||||
class="LinkPreview-module_wrapImageCaption"
|
||||
>
|
||||
<button
|
||||
aria-label="View image"
|
||||
class="image"
|
||||
class="LinkPreview-module_image"
|
||||
>
|
||||
<img
|
||||
alt=""
|
||||
class="thumbnail"
|
||||
class="LinkPreview-module_thumbnail"
|
||||
src="/static/element.png"
|
||||
/>
|
||||
</button>
|
||||
<div
|
||||
class="caption"
|
||||
class="LinkPreview-module_caption"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkPreview-module_title"
|
||||
>
|
||||
<a
|
||||
class="link"
|
||||
class="LinkPreview-module_link"
|
||||
href="https://matrix.org"
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
@ -445,7 +445,7 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</a>
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 container description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 LinkedText-module_container LinkPreview-module_description"
|
||||
>
|
||||
One more description
|
||||
</p>
|
||||
@ -453,7 +453,7 @@ exports[`UrlPreviewGroupView > renders with a compact view 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<button
|
||||
class="_button_13vu4_8 toggleButton"
|
||||
class="_button_13vu4_8 UrlPreviewGroupView-module_toggleButton"
|
||||
data-kind="tertiary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
|
||||
@ -21,7 +21,7 @@ exports[`<GroupView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
LEFT CONTENT
|
||||
@ -51,7 +51,7 @@ exports[`<GroupView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
MAIN CONTENT
|
||||
|
||||
@ -21,7 +21,7 @@ exports[`<LeftResizablePanelView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
LEFT CONTENT
|
||||
@ -51,7 +51,7 @@ exports[`<LeftResizablePanelView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
MAIN CONTENT
|
||||
|
||||
@ -21,7 +21,7 @@ exports[`<SeparatorView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
tabindex="0"
|
||||
>
|
||||
@ -36,7 +36,7 @@ exports[`<SeparatorView /> > renders Default story 1`] = `
|
||||
aria-valuemax="99.502"
|
||||
aria-valuemin="0"
|
||||
aria-valuenow="0"
|
||||
class="separator Separator visible"
|
||||
class="SeparatorView-module_separator Separator SeparatorView-module_visible"
|
||||
data-separator="inactive"
|
||||
data-testid="_r_2_"
|
||||
id="_r_2_"
|
||||
@ -67,7 +67,7 @@ exports[`<SeparatorView /> > renders Default story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
MAIN CONTENT
|
||||
@ -100,7 +100,7 @@ exports[`<SeparatorView /> > renders KeyboardFocused story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
tabindex="0"
|
||||
>
|
||||
@ -115,7 +115,7 @@ exports[`<SeparatorView /> > renders KeyboardFocused story 1`] = `
|
||||
aria-valuemax="99.502"
|
||||
aria-valuemin="0"
|
||||
aria-valuenow="49.751"
|
||||
class="separator Separator visible"
|
||||
class="SeparatorView-module_separator Separator SeparatorView-module_visible"
|
||||
data-separator="inactive"
|
||||
data-testid="_r_i_"
|
||||
id="_r_i_"
|
||||
@ -146,7 +146,7 @@ exports[`<SeparatorView /> > renders KeyboardFocused story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
MAIN CONTENT
|
||||
@ -179,7 +179,7 @@ exports[`<SeparatorView /> > renders LeftPanelExpanded story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
tabindex="0"
|
||||
>
|
||||
@ -190,7 +190,7 @@ exports[`<SeparatorView /> > renders LeftPanelExpanded story 1`] = `
|
||||
<div
|
||||
aria-label="Click or drag to expand"
|
||||
aria-orientation="vertical"
|
||||
class="separator Separator"
|
||||
class="SeparatorView-module_separator Separator"
|
||||
data-separator="inactive"
|
||||
data-testid="_r_a_"
|
||||
id="_r_a_"
|
||||
@ -221,7 +221,7 @@ exports[`<SeparatorView /> > renders LeftPanelExpanded story 1`] = `
|
||||
style="max-height: 100%; max-width: 100%; flex-grow: 1; overflow: auto; touch-action: pan-y;"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
MAIN CONTENT
|
||||
|
||||
@ -4,16 +4,16 @@ exports[`RoomListHeaderView > renders the default state 1`] = `
|
||||
<div>
|
||||
<header
|
||||
aria-label="Room options"
|
||||
class="flex header"
|
||||
class="Flex-module_flex RoomListHeaderView-module_header"
|
||||
data-testid="room-list-header"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: end; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListHeaderView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex title"
|
||||
class="Flex-module_flex RoomListHeaderView-module_title"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h1
|
||||
@ -27,7 +27,7 @@ exports[`RoomListHeaderView > renders the default state 1`] = `
|
||||
aria-expanded="false"
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open space menu"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 SpaceMenuView-module_button"
|
||||
data-kind="primary"
|
||||
data-state="closed"
|
||||
id="radix-_r_0_"
|
||||
@ -55,7 +55,7 @@ exports[`RoomListHeaderView > renders the default state 1`] = `
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -137,16 +137,16 @@ exports[`RoomListHeaderView > renders without compose menu 1`] = `
|
||||
<div>
|
||||
<header
|
||||
aria-label="Room options"
|
||||
class="flex header"
|
||||
class="Flex-module_flex RoomListHeaderView-module_header"
|
||||
data-testid="room-list-header"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: end; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListHeaderView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex title"
|
||||
class="Flex-module_flex RoomListHeaderView-module_title"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h1
|
||||
@ -160,7 +160,7 @@ exports[`RoomListHeaderView > renders without compose menu 1`] = `
|
||||
aria-expanded="false"
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open space menu"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 SpaceMenuView-module_button"
|
||||
data-kind="primary"
|
||||
data-state="closed"
|
||||
id="radix-_r_i_"
|
||||
@ -188,7 +188,7 @@ exports[`RoomListHeaderView > renders without compose menu 1`] = `
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -265,16 +265,16 @@ exports[`RoomListHeaderView > renders without space menu 1`] = `
|
||||
<div>
|
||||
<header
|
||||
aria-label="Room options"
|
||||
class="flex header"
|
||||
class="Flex-module_flex RoomListHeaderView-module_header"
|
||||
data-testid="room-list-header"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: end; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListHeaderView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="flex title"
|
||||
class="Flex-module_flex RoomListHeaderView-module_title"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h1
|
||||
@ -285,7 +285,7 @@ exports[`RoomListHeaderView > renders without space menu 1`] = `
|
||||
</h1>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
|
||||
@ -7,7 +7,7 @@ exports[`<SpaceMenuView /> > should match snapshot 1`] = `
|
||||
aria-expanded="false"
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open space menu"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 SpaceMenuView-module_button"
|
||||
data-kind="primary"
|
||||
data-state="closed"
|
||||
id="radix-_r_0_"
|
||||
|
||||
@ -6,7 +6,7 @@ exports[`<NotificationDecoration /> > snapshots > renders ActivityIndicator stor
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -26,7 +26,7 @@ exports[`<NotificationDecoration /> > snapshots > renders Invited story 1`] = `
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -52,7 +52,7 @@ exports[`<NotificationDecoration /> > snapshots > renders Mention story 1`] = `
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -81,7 +81,7 @@ exports[`<NotificationDecoration /> > snapshots > renders MentionWithCount story
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -112,7 +112,7 @@ exports[`<NotificationDecoration /> > snapshots > renders Muted story 1`] = `
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -149,7 +149,7 @@ exports[`<NotificationDecoration /> > snapshots > renders NotificationWithCount
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -169,7 +169,7 @@ exports[`<NotificationDecoration /> > snapshots > renders UnsentMessage story 1`
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -195,7 +195,7 @@ exports[`<NotificationDecoration /> > snapshots > renders VideoCall story 1`] =
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -221,7 +221,7 @@ exports[`<NotificationDecoration /> > snapshots > renders VoiceCall story 1`] =
|
||||
style="padding: 16px; background-color: var(--cpd-color-bg-canvas-default);"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
|
||||
@ -11,7 +11,7 @@ exports[`<RoomListItemView /> > renders Bold story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room Team Updates"
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -19,7 +19,7 @@ exports[`<RoomListItemView /> > renders Bold story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -30,28 +30,28 @@ exports[`<RoomListItemView /> > renders Bold story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Team Updates"
|
||||
>
|
||||
Team Updates
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -121,7 +121,7 @@ exports[`<RoomListItemView /> > renders Bold story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -141,7 +141,7 @@ exports[`<RoomListItemView /> > renders Default story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General"
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -149,7 +149,7 @@ exports[`<RoomListItemView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -160,28 +160,28 @@ exports[`<RoomListItemView /> > renders Default story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -251,7 +251,7 @@ exports[`<RoomListItemView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -271,7 +271,7 @@ exports[`<RoomListItemView /> > renders Invitation story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room Secret Project invitation."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -279,7 +279,7 @@ exports[`<RoomListItemView /> > renders Invitation story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -290,28 +290,28 @@ exports[`<RoomListItemView /> > renders Invitation story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Secret Project"
|
||||
>
|
||||
Secret Project
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Bob invited you"
|
||||
>
|
||||
Bob invited you
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -381,10 +381,10 @@ exports[`<RoomListItemView /> > renders Invitation story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -419,7 +419,7 @@ exports[`<RoomListItemView /> > renders NoMessagePreview story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General"
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -427,7 +427,7 @@ exports[`<RoomListItemView /> > renders NoMessagePreview story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -438,14 +438,14 @@ exports[`<RoomListItemView /> > renders NoMessagePreview story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
@ -453,7 +453,7 @@ exports[`<RoomListItemView /> > renders NoMessagePreview story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -523,7 +523,7 @@ exports[`<RoomListItemView /> > renders NoMessagePreview story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -543,7 +543,7 @@ exports[`<RoomListItemView /> > renders Selected story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General"
|
||||
aria-selected="true"
|
||||
class="flex roomListItem mx_RoomListItemView selected mx_RoomListItemView_selected"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_selected mx_RoomListItemView_selected"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -551,7 +551,7 @@ exports[`<RoomListItemView /> > renders Selected story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -562,28 +562,28 @@ exports[`<RoomListItemView /> > renders Selected story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -653,7 +653,7 @@ exports[`<RoomListItemView /> > renders Selected story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -673,7 +673,7 @@ exports[`<RoomListItemView /> > renders UnsentMessage story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General with an unsent message."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -681,7 +681,7 @@ exports[`<RoomListItemView /> > renders UnsentMessage story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -692,28 +692,28 @@ exports[`<RoomListItemView /> > renders UnsentMessage story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Failed to send message"
|
||||
>
|
||||
Failed to send message
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -783,10 +783,10 @@ exports[`<RoomListItemView /> > renders UnsentMessage story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -821,7 +821,7 @@ exports[`<RoomListItemView /> > renders WithHoverMenu story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General"
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -829,7 +829,7 @@ exports[`<RoomListItemView /> > renders WithHoverMenu story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -840,28 +840,28 @@ exports[`<RoomListItemView /> > renders WithHoverMenu story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -931,7 +931,7 @@ exports[`<RoomListItemView /> > renders WithHoverMenu story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -951,7 +951,7 @@ exports[`<RoomListItemView /> > renders WithMention story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General with 1 unread mention."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -959,7 +959,7 @@ exports[`<RoomListItemView /> > renders WithMention story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -970,28 +970,28 @@ exports[`<RoomListItemView /> > renders WithMention story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1061,10 +1061,10 @@ exports[`<RoomListItemView /> > renders WithMention story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -1104,7 +1104,7 @@ exports[`<RoomListItemView /> > renders WithNotification story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General with 3 unread messages."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -1112,7 +1112,7 @@ exports[`<RoomListItemView /> > renders WithNotification story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -1123,28 +1123,28 @@ exports[`<RoomListItemView /> > renders WithNotification story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1214,10 +1214,10 @@ exports[`<RoomListItemView /> > renders WithNotification story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -1246,7 +1246,7 @@ exports[`<RoomListItemView /> > renders WithVideoCall story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General with a video call."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -1254,7 +1254,7 @@ exports[`<RoomListItemView /> > renders WithVideoCall story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -1265,28 +1265,28 @@ exports[`<RoomListItemView /> > renders WithVideoCall story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1356,10 +1356,10 @@ exports[`<RoomListItemView /> > renders WithVideoCall story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -1394,7 +1394,7 @@ exports[`<RoomListItemView /> > renders WithVoiceCall story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Open room General with a voice call."
|
||||
aria-selected="false"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -1402,7 +1402,7 @@ exports[`<RoomListItemView /> > renders WithVoiceCall story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -1413,28 +1413,28 @@ exports[`<RoomListItemView /> > renders WithVoiceCall story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Alice: Hey everyone!"
|
||||
>
|
||||
Alice: Hey everyone!
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1504,10 +1504,10 @@ exports[`<RoomListItemView /> > renders WithVoiceCall story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`<RoomListPrimaryFilters /> stories > snapshots > renders Default story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex roomListPrimaryFilters"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_roomListPrimaryFilters"
|
||||
data-testid="primary-filters"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -11,7 +11,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders Default story
|
||||
aria-controls="_r_0_"
|
||||
aria-expanded="false"
|
||||
aria-label="Expand filter list"
|
||||
class="_icon-button_1215g_8 iconButton"
|
||||
class="_icon-button_1215g_8 RoomListPrimaryFilters-module_iconButton"
|
||||
data-kind="secondary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 28px;"
|
||||
@ -36,7 +36,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders Default story
|
||||
</button>
|
||||
<div
|
||||
aria-label="Room list filters"
|
||||
class="flex list"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_list"
|
||||
id="_r_0_"
|
||||
role="listbox"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
|
||||
@ -115,7 +115,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowContaine
|
||||
style="width: 180px; border: 1px dashed var(--cpd-color-border-interactive-secondary);"
|
||||
>
|
||||
<div
|
||||
class="flex roomListPrimaryFilters"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_roomListPrimaryFilters"
|
||||
data-testid="primary-filters"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -123,7 +123,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowContaine
|
||||
aria-controls="_r_3_"
|
||||
aria-expanded="false"
|
||||
aria-label="Expand filter list"
|
||||
class="_icon-button_1215g_8 iconButton"
|
||||
class="_icon-button_1215g_8 RoomListPrimaryFilters-module_iconButton"
|
||||
data-kind="secondary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 28px;"
|
||||
@ -148,7 +148,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowContaine
|
||||
</button>
|
||||
<div
|
||||
aria-label="Room list filters"
|
||||
class="flex list"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_list"
|
||||
id="_r_3_"
|
||||
role="listbox"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
|
||||
@ -192,7 +192,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowWithActi
|
||||
style="width: 180px; border: 1px dashed var(--cpd-color-border-interactive-secondary);"
|
||||
>
|
||||
<div
|
||||
class="flex roomListPrimaryFilters"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_roomListPrimaryFilters"
|
||||
data-testid="primary-filters"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -200,7 +200,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowWithActi
|
||||
aria-controls="_r_4_"
|
||||
aria-expanded="false"
|
||||
aria-label="Expand filter list"
|
||||
class="_icon-button_1215g_8 iconButton"
|
||||
class="_icon-button_1215g_8 RoomListPrimaryFilters-module_iconButton"
|
||||
data-kind="secondary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 28px;"
|
||||
@ -225,7 +225,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowWithActi
|
||||
</button>
|
||||
<div
|
||||
aria-label="Room list filters"
|
||||
class="flex list"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_list"
|
||||
id="_r_4_"
|
||||
role="listbox"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
|
||||
@ -263,13 +263,13 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NarrowWithActi
|
||||
exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NoFilters story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex roomListPrimaryFilters"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_roomListPrimaryFilters"
|
||||
data-testid="primary-filters"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
aria-label="Room list filters"
|
||||
class="flex list"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_list"
|
||||
id="_r_2_"
|
||||
role="listbox"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
|
||||
@ -281,7 +281,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders NoFilters stor
|
||||
exports[`<RoomListPrimaryFilters /> stories > snapshots > renders PeopleSelected story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex roomListPrimaryFilters"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_roomListPrimaryFilters"
|
||||
data-testid="primary-filters"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row-reverse; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -289,7 +289,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders PeopleSelected
|
||||
aria-controls="_r_1_"
|
||||
aria-expanded="false"
|
||||
aria-label="Expand filter list"
|
||||
class="_icon-button_1215g_8 iconButton"
|
||||
class="_icon-button_1215g_8 RoomListPrimaryFilters-module_iconButton"
|
||||
data-kind="secondary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 28px;"
|
||||
@ -314,7 +314,7 @@ exports[`<RoomListPrimaryFilters /> stories > snapshots > renders PeopleSelected
|
||||
</button>
|
||||
<div
|
||||
aria-label="Room list filters"
|
||||
class="flex list"
|
||||
class="Flex-module_flex RoomListPrimaryFilters-module_list"
|
||||
id="_r_1_"
|
||||
role="listbox"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: wrap;"
|
||||
|
||||
@ -3,13 +3,13 @@
|
||||
exports[`RoomListSearchView > Storybook snapshots > renders the default state 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex view"
|
||||
class="Flex-module_flex RoomListSearchView-module_view"
|
||||
data-testid="room-list-search"
|
||||
role="search"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 search _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomListSearchView-module_search _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
id="room-list-search-button"
|
||||
@ -29,11 +29,11 @@ exports[`RoomListSearchView > Storybook snapshots > renders the default state 1`
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="flex search_container"
|
||||
class="Flex-module_flex RoomListSearchView-module_search_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="search_text"
|
||||
class="RoomListSearchView-module_search_text"
|
||||
>
|
||||
Search
|
||||
</span>
|
||||
@ -70,13 +70,13 @@ exports[`RoomListSearchView > Storybook snapshots > renders the default state 1`
|
||||
exports[`RoomListSearchView > Storybook snapshots > renders with all buttons visible 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex view"
|
||||
class="Flex-module_flex RoomListSearchView-module_view"
|
||||
data-testid="room-list-search"
|
||||
role="search"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 search _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomListSearchView-module_search _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
id="room-list-search-button"
|
||||
@ -96,11 +96,11 @@ exports[`RoomListSearchView > Storybook snapshots > renders with all buttons vis
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="flex search_container"
|
||||
class="Flex-module_flex RoomListSearchView-module_search_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="search_text"
|
||||
class="RoomListSearchView-module_search_text"
|
||||
>
|
||||
Search
|
||||
</span>
|
||||
@ -158,13 +158,13 @@ exports[`RoomListSearchView > Storybook snapshots > renders with all buttons vis
|
||||
exports[`RoomListSearchView > Storybook snapshots > renders with dial pad button 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex view"
|
||||
class="Flex-module_flex RoomListSearchView-module_view"
|
||||
data-testid="room-list-search"
|
||||
role="search"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 search _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomListSearchView-module_search _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
id="room-list-search-button"
|
||||
@ -184,11 +184,11 @@ exports[`RoomListSearchView > Storybook snapshots > renders with dial pad button
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="flex search_container"
|
||||
class="Flex-module_flex RoomListSearchView-module_search_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="search_text"
|
||||
class="RoomListSearchView-module_search_text"
|
||||
>
|
||||
Search
|
||||
</span>
|
||||
@ -246,13 +246,13 @@ exports[`RoomListSearchView > Storybook snapshots > renders with dial pad button
|
||||
exports[`RoomListSearchView > Storybook snapshots > renders without explore button 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex view"
|
||||
class="Flex-module_flex RoomListSearchView-module_view"
|
||||
data-testid="room-list-search"
|
||||
role="search"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 search _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomListSearchView-module_search _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
id="room-list-search-button"
|
||||
@ -272,11 +272,11 @@ exports[`RoomListSearchView > Storybook snapshots > renders without explore butt
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="flex search_container"
|
||||
class="Flex-module_flex RoomListSearchView-module_search_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: space-between; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="search_text"
|
||||
class="RoomListSearchView-module_search_text"
|
||||
>
|
||||
Search
|
||||
</span>
|
||||
|
||||
@ -17,13 +17,13 @@ exports[`<RoomListSectionHeaderView /> stories > renders Default story 1`] = `
|
||||
<button
|
||||
aria-expanded="true"
|
||||
aria-label="Toggle Favourites section"
|
||||
class="header"
|
||||
class="RoomListSectionHeaderView-module_header"
|
||||
role="gridcell"
|
||||
tabindex="-1"
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListSectionHeaderView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-0-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<svg
|
||||
@ -38,7 +38,7 @@ exports[`<RoomListSectionHeaderView /> stories > renders Default story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<span
|
||||
class="title"
|
||||
class="RoomListSectionHeaderView-module_title"
|
||||
>
|
||||
Favourites
|
||||
</span>
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -36,7 +36,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="1"
|
||||
aria-selected="true"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView selected bold firstItem mx_RoomListItemView_selected"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_selected RoomListItemView-module_bold RoomListItemView-module_firstItem mx_RoomListItemView_selected"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -44,7 +44,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -55,28 +55,28 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
GE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="General"
|
||||
>
|
||||
General
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Last message in General"
|
||||
>
|
||||
Last message in General
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -146,10 +146,10 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -185,7 +185,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="2"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -193,7 +193,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -204,14 +204,14 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
RA
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Random"
|
||||
>
|
||||
@ -219,7 +219,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -289,7 +289,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -307,7 +307,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="3"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -315,7 +315,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -326,28 +326,28 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
EN
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Engineering"
|
||||
>
|
||||
Engineering
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Last message in Engineering"
|
||||
>
|
||||
Last message in Engineering
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -417,7 +417,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -435,7 +435,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="4"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -443,7 +443,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -454,14 +454,14 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
DE
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Design"
|
||||
>
|
||||
@ -469,7 +469,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -539,7 +539,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -557,7 +557,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="5"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -565,7 +565,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -576,28 +576,28 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
PR
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Product"
|
||||
>
|
||||
Product
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Last message in Product"
|
||||
>
|
||||
Last message in Product
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -667,7 +667,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -685,7 +685,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="6"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -693,7 +693,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -704,14 +704,14 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
MA
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Marketing"
|
||||
>
|
||||
@ -719,7 +719,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -789,10 +789,10 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="notification-decoration"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -830,7 +830,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="7"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView bold"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -838,7 +838,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -849,28 +849,28 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
SA
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Sales"
|
||||
>
|
||||
Sales
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Last message in Sales"
|
||||
>
|
||||
Last message in Sales
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -940,7 +940,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -958,7 +958,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="8"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -966,7 +966,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -977,14 +977,14 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
SU
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Support"
|
||||
>
|
||||
@ -992,7 +992,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1062,7 +1062,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -1080,7 +1080,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="9"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -1088,7 +1088,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -1099,28 +1099,28 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
AN
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Announcements"
|
||||
>
|
||||
Announcements
|
||||
</div>
|
||||
<div
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 ellipsis"
|
||||
class="_typography_6v6n8_153 _font-body-sm-regular_6v6n8_31 RoomListItemView-module_ellipsis"
|
||||
title="Last message in Announcements"
|
||||
>
|
||||
Last message in Announcements
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1190,7 +1190,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -1208,7 +1208,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
aria-posinset="10"
|
||||
aria-selected="false"
|
||||
aria-setsize="10"
|
||||
class="flex roomListItem mx_RoomListItemView bold lastItem"
|
||||
class="Flex-module_flex RoomListItemView-module_roomListItem mx_RoomListItemView RoomListItemView-module_bold RoomListItemView-module_lastItem"
|
||||
data-state="closed"
|
||||
role="option"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: stretch; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
@ -1216,7 +1216,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="flex container"
|
||||
class="Flex-module_flex RoomListItemView-module_container"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-3x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
@ -1227,14 +1227,14 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
OF
|
||||
</div>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex RoomListItemView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: space-between; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<div
|
||||
class="ellipsis"
|
||||
class="RoomListItemView-module_ellipsis"
|
||||
>
|
||||
<div
|
||||
class="roomName"
|
||||
class="RoomListItemView-module_roomName"
|
||||
data-testid="room-name"
|
||||
title="Off-topic"
|
||||
>
|
||||
@ -1242,7 +1242,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex hoverMenu"
|
||||
class="Flex-module_flex RoomListItemView-module_hoverMenu"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
@ -1312,7 +1312,7 @@ exports[`<VirtualizedRoomListView /> > renders Default story 1`] = `
|
||||
</div>
|
||||
<div
|
||||
aria-hidden="true"
|
||||
class="notificationDecoration"
|
||||
class="RoomListItemView-module_notificationDecoration"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -4,12 +4,12 @@ exports[`RoomStatusBarView > renders connection lost 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_0_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -25,26 +25,26 @@ exports[`RoomStatusBarView > renders connection lost 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_0_"
|
||||
>
|
||||
Connectivity to the server has been lost.
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 RoomStatusBarView-module_description"
|
||||
>
|
||||
Sent messages will be stored until your connection has returned.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
@ -54,12 +54,12 @@ exports[`RoomStatusBarView > renders consent link 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_2_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -75,13 +75,13 @@ exports[`RoomStatusBarView > renders consent link 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_2_"
|
||||
>
|
||||
You can't send any messages until you review and agree to our terms and conditions.
|
||||
@ -89,10 +89,10 @@ exports[`RoomStatusBarView > renders consent link 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<a
|
||||
class="_button_13vu4_8 primaryAction"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_primaryAction"
|
||||
data-kind="primary"
|
||||
data-size="sm"
|
||||
href="#example"
|
||||
@ -112,12 +112,12 @@ exports[`RoomStatusBarView > renders local room error 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_6_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -133,20 +133,20 @@ exports[`RoomStatusBarView > renders local room error 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_6_"
|
||||
>
|
||||
Could not start a chat with this user
|
||||
</p>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 primaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_primaryAction _has-icon_13vu4_60"
|
||||
data-kind="primary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -175,12 +175,12 @@ exports[`RoomStatusBarView > renders resource limit error 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_1_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -196,26 +196,26 @@ exports[`RoomStatusBarView > renders resource limit error 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_1_"
|
||||
>
|
||||
Your message wasn't sent because this homeserver has been blocked by its administrator.
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 RoomStatusBarView-module_description"
|
||||
>
|
||||
Please contact your service administrator to continue using the service.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<a
|
||||
class="_button_13vu4_8"
|
||||
@ -238,12 +238,12 @@ exports[`RoomStatusBarView > renders unsent messages 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_3_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -259,29 +259,29 @@ exports[`RoomStatusBarView > renders unsent messages 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_3_"
|
||||
>
|
||||
Some of your messages have not been sent
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 RoomStatusBarView-module_description"
|
||||
>
|
||||
You can select all or individual messages to retry or delete
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 secondaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_secondaryAction _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -302,7 +302,7 @@ exports[`RoomStatusBarView > renders unsent messages 1`] = `
|
||||
Delete all
|
||||
</button>
|
||||
<button
|
||||
class="_button_13vu4_8 primaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_primaryAction _has-icon_13vu4_60"
|
||||
data-kind="primary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -331,12 +331,12 @@ exports[`RoomStatusBarView > renders unsent messages and deletes all 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_4_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -352,29 +352,29 @@ exports[`RoomStatusBarView > renders unsent messages and deletes all 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_4_"
|
||||
>
|
||||
Some of your messages have not been sent
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 RoomStatusBarView-module_description"
|
||||
>
|
||||
You can select all or individual messages to retry or delete
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 secondaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_secondaryAction _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -395,7 +395,7 @@ exports[`RoomStatusBarView > renders unsent messages and deletes all 1`] = `
|
||||
Delete all
|
||||
</button>
|
||||
<button
|
||||
class="_button_13vu4_8 primaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_primaryAction _has-icon_13vu4_60"
|
||||
data-kind="primary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -424,12 +424,12 @@ exports[`RoomStatusBarView > renders unsent messages and resends all 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-labelledby="_r_5_"
|
||||
class="banner"
|
||||
class="Banner-module_banner"
|
||||
data-type="critical"
|
||||
role="status"
|
||||
>
|
||||
<div
|
||||
class="icon"
|
||||
class="Banner-module_icon"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -445,29 +445,29 @@ exports[`RoomStatusBarView > renders unsent messages and resends all 1`] = `
|
||||
</svg>
|
||||
</div>
|
||||
<div
|
||||
class="content"
|
||||
class="Banner-module_content"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="RoomStatusBarView-module_container"
|
||||
>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 title"
|
||||
class="_typography_6v6n8_153 _font-body-md-medium_6v6n8_60 RoomStatusBarView-module_title"
|
||||
id="_r_5_"
|
||||
>
|
||||
Some of your messages have not been sent
|
||||
</p>
|
||||
<p
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 description"
|
||||
class="_typography_6v6n8_153 _font-body-md-regular_6v6n8_50 RoomStatusBarView-module_description"
|
||||
>
|
||||
You can select all or individual messages to retry or delete
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="actions"
|
||||
class="Banner-module_actions"
|
||||
>
|
||||
<button
|
||||
class="_button_13vu4_8 secondaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_secondaryAction _has-icon_13vu4_60"
|
||||
data-kind="secondary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
@ -488,7 +488,7 @@ exports[`RoomStatusBarView > renders unsent messages and resends all 1`] = `
|
||||
Delete all
|
||||
</button>
|
||||
<button
|
||||
class="_button_13vu4_8 primaryAction _has-icon_13vu4_60"
|
||||
class="_button_13vu4_8 RoomStatusBarView-module_primaryAction _has-icon_13vu4_60"
|
||||
data-kind="primary"
|
||||
data-size="sm"
|
||||
role="button"
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`WidgetPipView > detects back click action 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="WidgetPipView-module_container"
|
||||
data-testid="widget-pip-container"
|
||||
>
|
||||
<div
|
||||
class="header"
|
||||
class="WidgetPipView-module_header"
|
||||
>
|
||||
<button
|
||||
aria-labelledby="_r_6_"
|
||||
@ -41,7 +41,7 @@ exports[`WidgetPipView > detects back click action 1`] = `
|
||||
Room Name
|
||||
</div>
|
||||
<div
|
||||
class="roundedCornerContainer"
|
||||
class="WidgetPipView-module_roundedCornerContainer"
|
||||
>
|
||||
<div
|
||||
style="background-color: grey; flex-grow: 1;"
|
||||
@ -54,11 +54,11 @@ exports[`WidgetPipView > detects back click action 1`] = `
|
||||
exports[`WidgetPipView > detects double click triggers back 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="WidgetPipView-module_container"
|
||||
data-testid="widget-pip-container"
|
||||
>
|
||||
<div
|
||||
class="header"
|
||||
class="WidgetPipView-module_header"
|
||||
>
|
||||
<button
|
||||
aria-labelledby="_r_c_"
|
||||
@ -92,7 +92,7 @@ exports[`WidgetPipView > detects double click triggers back 1`] = `
|
||||
Room Name
|
||||
</div>
|
||||
<div
|
||||
class="roundedCornerContainer"
|
||||
class="WidgetPipView-module_roundedCornerContainer"
|
||||
>
|
||||
<div
|
||||
style="background-color: grey; flex-grow: 1;"
|
||||
@ -105,11 +105,11 @@ exports[`WidgetPipView > detects double click triggers back 1`] = `
|
||||
exports[`WidgetPipView > detects on mouse down for drag 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="WidgetPipView-module_container"
|
||||
data-testid="widget-pip-container"
|
||||
>
|
||||
<div
|
||||
class="header"
|
||||
class="WidgetPipView-module_header"
|
||||
>
|
||||
<button
|
||||
aria-labelledby="_r_i_"
|
||||
@ -143,7 +143,7 @@ exports[`WidgetPipView > detects on mouse down for drag 1`] = `
|
||||
Room Name
|
||||
</div>
|
||||
<div
|
||||
class="roundedCornerContainer"
|
||||
class="WidgetPipView-module_roundedCornerContainer"
|
||||
>
|
||||
<div
|
||||
style="background-color: grey; flex-grow: 1;"
|
||||
@ -156,11 +156,11 @@ exports[`WidgetPipView > detects on mouse down for drag 1`] = `
|
||||
exports[`WidgetPipView > renders with gray widget 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="WidgetPipView-module_container"
|
||||
data-testid="widget-pip-container"
|
||||
>
|
||||
<div
|
||||
class="header"
|
||||
class="WidgetPipView-module_header"
|
||||
>
|
||||
<button
|
||||
aria-labelledby="_r_0_"
|
||||
@ -194,7 +194,7 @@ exports[`WidgetPipView > renders with gray widget 1`] = `
|
||||
Room Name
|
||||
</div>
|
||||
<div
|
||||
class="roundedCornerContainer"
|
||||
class="WidgetPipView-module_roundedCornerContainer"
|
||||
>
|
||||
<div
|
||||
style="background-color: grey; flex-grow: 1;"
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`DateSeparatorView > renders default story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Today"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -12,7 +12,7 @@ exports[`DateSeparatorView > renders default story 1`] = `
|
||||
role="none"
|
||||
/>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex DateSeparatorView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h2
|
||||
@ -33,7 +33,7 @@ exports[`DateSeparatorView > renders long localized label story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Wednesday, December 17, 2025 at 11:59 PM Coordinated Universal Time"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -41,7 +41,7 @@ exports[`DateSeparatorView > renders long localized label story 1`] = `
|
||||
role="none"
|
||||
/>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex DateSeparatorView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h2
|
||||
@ -62,7 +62,7 @@ exports[`DateSeparatorView > renders with extra class names 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Today"
|
||||
class="flex extra_class_1 extra_class_2 timelineSeparator"
|
||||
class="Flex-module_flex extra_class_1 extra_class_2 TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -70,7 +70,7 @@ exports[`DateSeparatorView > renders with extra class names 1`] = `
|
||||
role="none"
|
||||
/>
|
||||
<div
|
||||
class="flex content"
|
||||
class="Flex-module_flex DateSeparatorView-module_content"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<h2
|
||||
@ -90,7 +90,7 @@ exports[`DateSeparatorView > renders with extra class names 1`] = `
|
||||
exports[`DateSeparatorView > renders with jump to date picker story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="none"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -105,7 +105,7 @@ exports[`DateSeparatorView > renders with jump to date picker story 1`] = `
|
||||
aria-haspopup="menu"
|
||||
aria-label="Jump to date"
|
||||
aria-live="off"
|
||||
class="flex content"
|
||||
class="Flex-module_flex DateSeparatorView-module_content"
|
||||
data-state="open"
|
||||
data-testid="jump-to-date-separator-button"
|
||||
id="radix-_r_0_"
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator in
|
||||
<div>
|
||||
<div
|
||||
aria-label="Label Separator"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -23,7 +23,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator wit
|
||||
<div>
|
||||
<div
|
||||
aria-label="Custom Label"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -32,7 +32,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator wit
|
||||
/>
|
||||
<h2
|
||||
aria-hidden="true"
|
||||
class="timelineSeparator"
|
||||
class="TimelineSeparator-module_timelineSeparator"
|
||||
>
|
||||
Thursday
|
||||
</h2>
|
||||
@ -47,7 +47,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator wit
|
||||
<div>
|
||||
<div
|
||||
aria-label="Date Event Separator"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -66,7 +66,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator wit
|
||||
<div>
|
||||
<div
|
||||
aria-label="Late Event Separator"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
@ -85,7 +85,7 @@ exports[`TimelineSeparator > Snapshot tests > renders the timeline separator wit
|
||||
<div>
|
||||
<div
|
||||
aria-label="Separator without children"
|
||||
class="flex timelineSeparator"
|
||||
class="Flex-module_flex TimelineSeparator-module_timelineSeparator"
|
||||
role="separator"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
|
||||
@ -3,12 +3,12 @@
|
||||
exports[`DisambiguatedProfileView > renders the default state 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Alice
|
||||
@ -20,19 +20,19 @@ exports[`DisambiguatedProfileView > renders the default state 1`] = `
|
||||
exports[`DisambiguatedProfileView > renders the full example 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
title="Eve (@eve:matrix.org)"
|
||||
>
|
||||
<span
|
||||
class="mx_Username_color5 disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="mx_Username_color5 DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Eve
|
||||
</span>
|
||||
<span
|
||||
class="mx_DisambiguatedProfile_mxid disambiguatedProfile_mxid"
|
||||
class="mx_DisambiguatedProfile_mxid DisambiguatedProfile-module_disambiguatedProfile_mxid"
|
||||
>
|
||||
@eve:matrix.org
|
||||
</span>
|
||||
@ -43,18 +43,18 @@ exports[`DisambiguatedProfileView > renders the full example 1`] = `
|
||||
exports[`DisambiguatedProfileView > renders with MXID for disambiguation 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="mx_Username_color1 disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="mx_Username_color1 DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Alice
|
||||
</span>
|
||||
<span
|
||||
class="mx_DisambiguatedProfile_mxid disambiguatedProfile_mxid"
|
||||
class="mx_DisambiguatedProfile_mxid DisambiguatedProfile-module_disambiguatedProfile_mxid"
|
||||
>
|
||||
@alice:example.org
|
||||
</span>
|
||||
@ -65,12 +65,12 @@ exports[`DisambiguatedProfileView > renders with MXID for disambiguation 1`] = `
|
||||
exports[`DisambiguatedProfileView > renders with color class 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="mx_Username_color3 disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="mx_Username_color3 DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Bob
|
||||
@ -82,12 +82,12 @@ exports[`DisambiguatedProfileView > renders with color class 1`] = `
|
||||
exports[`DisambiguatedProfileView > renders with emphasized display name 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Charlie
|
||||
@ -99,13 +99,13 @@ exports[`DisambiguatedProfileView > renders with emphasized display name 1`] = `
|
||||
exports[`DisambiguatedProfileView > renders with tooltip 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="disambiguatedProfile"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
title="Diana (@diana:example.org)"
|
||||
>
|
||||
<span
|
||||
class="disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
class="DisambiguatedProfile-module_disambiguatedProfile_displayName mx_DisambiguatedProfile_displayName"
|
||||
dir="auto"
|
||||
>
|
||||
Diana
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`EncryptionEventView > renders Default story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -18,12 +18,12 @@ exports[`EncryptionEventView > renders Default story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages in this room are end-to-end encrypted. When people join, you can verify them in their profile, just tap on their profile picture.
|
||||
</div>
|
||||
@ -34,7 +34,7 @@ exports[`EncryptionEventView > renders Default story 1`] = `
|
||||
exports[`EncryptionEventView > renders DisableAttempt story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -49,12 +49,12 @@ exports[`EncryptionEventView > renders DisableAttempt story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Ignored attempt to disable encryption
|
||||
</div>
|
||||
@ -65,7 +65,7 @@ exports[`EncryptionEventView > renders DisableAttempt story 1`] = `
|
||||
exports[`EncryptionEventView > renders EnabledDirectMessage story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -80,12 +80,12 @@ exports[`EncryptionEventView > renders EnabledDirectMessage story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages here are end-to-end encrypted. Verify Alice in their profile - tap on their profile picture.
|
||||
</div>
|
||||
@ -96,7 +96,7 @@ exports[`EncryptionEventView > renders EnabledDirectMessage story 1`] = `
|
||||
exports[`EncryptionEventView > renders EnabledLocalRoom story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -111,12 +111,12 @@ exports[`EncryptionEventView > renders EnabledLocalRoom story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages in this chat will be end-to-end encrypted.
|
||||
</div>
|
||||
@ -127,7 +127,7 @@ exports[`EncryptionEventView > renders EnabledLocalRoom story 1`] = `
|
||||
exports[`EncryptionEventView > renders ParametersChanged story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -142,12 +142,12 @@ exports[`EncryptionEventView > renders ParametersChanged story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Some encryption parameters have been changed.
|
||||
</div>
|
||||
@ -158,7 +158,7 @@ exports[`EncryptionEventView > renders ParametersChanged story 1`] = `
|
||||
exports[`EncryptionEventView > renders StateEncryptionEnabled story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -173,12 +173,12 @@ exports[`EncryptionEventView > renders StateEncryptionEnabled story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Experimental state encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages and state events in this room are end-to-end encrypted. When people join, you can verify them in their profile, just tap on their profile picture.
|
||||
</div>
|
||||
@ -189,7 +189,7 @@ exports[`EncryptionEventView > renders StateEncryptionEnabled story 1`] = `
|
||||
exports[`EncryptionEventView > renders Unsupported story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="unsupported"
|
||||
@ -204,12 +204,12 @@ exports[`EncryptionEventView > renders Unsupported story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption not enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
The encryption used by this room isn't supported.
|
||||
</div>
|
||||
@ -220,7 +220,7 @@ exports[`EncryptionEventView > renders Unsupported story 1`] = `
|
||||
exports[`EncryptionEventView > renders WithTimestamp story 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container content"
|
||||
class="EventTileBubble-module_container EncryptionEventView-module_content"
|
||||
>
|
||||
<svg
|
||||
data-state="supported"
|
||||
@ -235,12 +235,12 @@ exports[`EncryptionEventView > renders WithTimestamp story 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages in this room are end-to-end encrypted. When people join, you can verify them in their profile, just tap on their profile picture.
|
||||
</div>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`EventTileBubble > renders the event tile bubble 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container custom-class"
|
||||
class="EventTileBubble-module_container custom-class"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -17,12 +17,12 @@ exports[`EventTileBubble > renders the event tile bubble 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Title goes here
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Subtitle goes here
|
||||
</div>
|
||||
@ -33,7 +33,7 @@ exports[`EventTileBubble > renders the event tile bubble 1`] = `
|
||||
exports[`EventTileBubble > renders the event tile bubble as crypto event bubble 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="EventTileBubble-module_container"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -47,12 +47,12 @@ exports[`EventTileBubble > renders the event tile bubble as crypto event bubble
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Encryption enabled
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Messages here are end-to-end encrypted. Verify XYZ in their profile - tap on their profile picture.
|
||||
</div>
|
||||
@ -63,7 +63,7 @@ exports[`EventTileBubble > renders the event tile bubble as crypto event bubble
|
||||
exports[`EventTileBubble > renders the event tile bubble with children 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="EventTileBubble-module_container"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -77,12 +77,12 @@ exports[`EventTileBubble > renders the event tile bubble with children 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Title goes here
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Subtitle goes here
|
||||
</div>
|
||||
@ -96,7 +96,7 @@ exports[`EventTileBubble > renders the event tile bubble with children 1`] = `
|
||||
exports[`EventTileBubble > renders the event tile bubble with icon 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="container"
|
||||
class="EventTileBubble-module_container"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -110,12 +110,12 @@ exports[`EventTileBubble > renders the event tile bubble with icon 1`] = `
|
||||
/>
|
||||
</svg>
|
||||
<div
|
||||
class="title"
|
||||
class="EventTileBubble-module_title"
|
||||
>
|
||||
Title goes here
|
||||
</div>
|
||||
<div
|
||||
class="subtitle"
|
||||
class="EventTileBubble-module_subtitle"
|
||||
>
|
||||
Subtitle goes here
|
||||
</div>
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`PinnedMessageBadge > renders the default badge 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-describedby="event-tile-description"
|
||||
class="pinnedMessageBadge"
|
||||
class="PinnedMessageBadge-module_pinnedMessageBadge"
|
||||
tabindex="0"
|
||||
>
|
||||
<svg
|
||||
|
||||
@ -4,15 +4,15 @@ exports[`TileErrorView > renders the bubble layout variant 1`] = `
|
||||
<div>
|
||||
<ul>
|
||||
<li
|
||||
class="tileErrorView bubble"
|
||||
class="TileErrorView-module_tileErrorView TileErrorView-module_bubble"
|
||||
data-layout="bubble"
|
||||
>
|
||||
<div
|
||||
class="line"
|
||||
class="TileErrorView-module_line"
|
||||
role="status"
|
||||
>
|
||||
<span
|
||||
class="message"
|
||||
class="TileErrorView-module_message"
|
||||
>
|
||||
Can't load this message
|
||||
(m.room.message)
|
||||
@ -27,7 +27,7 @@ exports[`TileErrorView > renders the bubble layout variant 1`] = `
|
||||
Submit debug logs
|
||||
</button>
|
||||
<button
|
||||
class="viewSourceButton"
|
||||
class="TileErrorView-module_viewSourceButton"
|
||||
type="button"
|
||||
>
|
||||
View source
|
||||
@ -42,15 +42,15 @@ exports[`TileErrorView > renders the default tile error state 1`] = `
|
||||
<div>
|
||||
<ul>
|
||||
<li
|
||||
class="tileErrorView"
|
||||
class="TileErrorView-module_tileErrorView"
|
||||
data-layout="group"
|
||||
>
|
||||
<div
|
||||
class="line"
|
||||
class="TileErrorView-module_line"
|
||||
role="status"
|
||||
>
|
||||
<span
|
||||
class="message"
|
||||
class="TileErrorView-module_message"
|
||||
>
|
||||
Can't load this message
|
||||
(m.room.message)
|
||||
@ -65,7 +65,7 @@ exports[`TileErrorView > renders the default tile error state 1`] = `
|
||||
Submit debug logs
|
||||
</button>
|
||||
<button
|
||||
class="viewSourceButton"
|
||||
class="TileErrorView-module_viewSourceButton"
|
||||
type="button"
|
||||
>
|
||||
View source
|
||||
|
||||
@ -5,13 +5,13 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-label="Hide"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -34,7 +34,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Download"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -56,7 +56,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="React"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -81,7 +81,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Reply"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -104,7 +104,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Reply in thread"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -129,7 +129,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Edit"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -154,7 +154,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
<button
|
||||
aria-label="Pin"
|
||||
aria-pressed="false"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -178,7 +178,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Retry"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -200,7 +200,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Delete"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -223,7 +223,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
<button
|
||||
aria-expanded="false"
|
||||
aria-label="Expand quotes"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -245,7 +245,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -267,7 +267,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="View in room"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -289,7 +289,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Copy link to thread"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -311,7 +311,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Remove"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -333,7 +333,7 @@ exports[`ActionBarView > story snapshots > renders AllIconActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="View Source"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -362,13 +362,13 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-label="Hide"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -380,7 +380,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Download"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -391,7 +391,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="React"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -402,7 +402,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Reply"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -414,7 +414,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Reply in thread"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -425,7 +425,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Edit"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -437,7 +437,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
<button
|
||||
aria-label="Pin"
|
||||
aria-pressed="false"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -448,7 +448,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Retry"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -459,7 +459,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Delete"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -471,7 +471,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
<button
|
||||
aria-expanded="false"
|
||||
aria-label="Expand quotes"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -482,7 +482,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -493,7 +493,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="View in room"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -504,7 +504,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Copy link to thread"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -515,7 +515,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Remove"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -526,7 +526,7 @@ exports[`ActionBarView > story snapshots > renders AllLabelActions 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="View Source"
|
||||
class="_button_13vu4_8 toolbar_item"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item"
|
||||
data-kind="tertiary"
|
||||
data-presentation="label"
|
||||
data-size="sm"
|
||||
@ -544,14 +544,14 @@ exports[`ActionBarView > story snapshots > renders DecryptingAttachment 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="true"
|
||||
aria-label="Decrypting"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -577,7 +577,7 @@ exports[`ActionBarView > story snapshots > renders DecryptingAttachment 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -606,13 +606,13 @@ exports[`ActionBarView > story snapshots > renders DisabledThreadReply 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-label="React"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -637,7 +637,7 @@ exports[`ActionBarView > story snapshots > renders DisabledThreadReply 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Reply"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -660,7 +660,7 @@ exports[`ActionBarView > story snapshots > renders DisabledThreadReply 1`] = `
|
||||
<button
|
||||
aria-disabled="true"
|
||||
aria-label="Reply in thread"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -685,7 +685,7 @@ exports[`ActionBarView > story snapshots > renders DisabledThreadReply 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -714,14 +714,14 @@ exports[`ActionBarView > story snapshots > renders DownloadingAttachment 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="true"
|
||||
aria-label="Downloading"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -747,7 +747,7 @@ exports[`ActionBarView > story snapshots > renders DownloadingAttachment 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -776,13 +776,13 @@ exports[`ActionBarView > story snapshots > renders ExpandedReplyChain 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-label="Reply"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -805,7 +805,7 @@ exports[`ActionBarView > story snapshots > renders ExpandedReplyChain 1`] = `
|
||||
<button
|
||||
aria-expanded="true"
|
||||
aria-label="Collapse quotes"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -827,7 +827,7 @@ exports[`ActionBarView > story snapshots > renders ExpandedReplyChain 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -856,13 +856,13 @@ exports[`ActionBarView > story snapshots > renders PinnedMessage 1`] = `
|
||||
<div
|
||||
aria-label="Message Actions"
|
||||
aria-live="off"
|
||||
class="flex mx_MessageActionBar toolbar"
|
||||
class="Flex-module_flex mx_MessageActionBar ActionBarView-module_toolbar"
|
||||
role="toolbar"
|
||||
style="--mx-flex-display: inline-flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-label="React"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -887,7 +887,7 @@ exports[`ActionBarView > story snapshots > renders PinnedMessage 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Reply"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -910,7 +910,7 @@ exports[`ActionBarView > story snapshots > renders PinnedMessage 1`] = `
|
||||
<button
|
||||
aria-label="Unpin"
|
||||
aria-pressed="true"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
@ -937,7 +937,7 @@ exports[`ActionBarView > story snapshots > renders PinnedMessage 1`] = `
|
||||
</button>
|
||||
<button
|
||||
aria-label="Options"
|
||||
class="_button_13vu4_8 toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
class="_button_13vu4_8 ActionBarView-module_toolbar_item _has-icon_13vu4_60 _icon-only_13vu4_53"
|
||||
data-kind="tertiary"
|
||||
data-presentation="icon"
|
||||
data-size="sm"
|
||||
|
||||
@ -4,19 +4,19 @@ exports[`AudioPlayerView > renders the audio player in default state 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Audio player"
|
||||
class="mx_MediaBody mediaBody audioPlayer"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody AudioPlayerView-module_audioPlayer"
|
||||
role="region"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Play"
|
||||
aria-labelledby="_r_0_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
@ -40,17 +40,17 @@ exports[`AudioPlayerView > renders the audio player in default state 1`] = `
|
||||
</div>
|
||||
</button>
|
||||
<div
|
||||
class="flex mediaInfo"
|
||||
class="Flex-module_flex AudioPlayerView-module_mediaInfo"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="mediaName"
|
||||
class="AudioPlayerView-module_mediaName"
|
||||
data-testid="audio-player-name"
|
||||
>
|
||||
Sample Audio
|
||||
</span>
|
||||
<div
|
||||
class="flex byline"
|
||||
class="Flex-module_flex AudioPlayerView-module_byline"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<time
|
||||
@ -64,13 +64,13 @@ exports[`AudioPlayerView > renders the audio player in default state 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="audio-player-seek"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<input
|
||||
aria-label="Audio seek bar"
|
||||
class="seekBar"
|
||||
class="SeekBar-module_seekBar"
|
||||
max="100"
|
||||
min="0"
|
||||
step="1"
|
||||
@ -80,7 +80,7 @@ exports[`AudioPlayerView > renders the audio player in default state 1`] = `
|
||||
value="30"
|
||||
/>
|
||||
<time
|
||||
class="mx_Clock clock"
|
||||
class="mx_Clock AudioPlayerView-module_clock"
|
||||
datetime="PT2M"
|
||||
role="timer"
|
||||
>
|
||||
@ -95,19 +95,19 @@ exports[`AudioPlayerView > renders the audio player in error state 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Audio player"
|
||||
class="mx_MediaBody mediaBody audioPlayer"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody AudioPlayerView-module_audioPlayer"
|
||||
role="region"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Play"
|
||||
aria-labelledby="_r_i_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
@ -131,17 +131,17 @@ exports[`AudioPlayerView > renders the audio player in error state 1`] = `
|
||||
</div>
|
||||
</button>
|
||||
<div
|
||||
class="flex mediaInfo"
|
||||
class="Flex-module_flex AudioPlayerView-module_mediaInfo"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="mediaName"
|
||||
class="AudioPlayerView-module_mediaName"
|
||||
data-testid="audio-player-name"
|
||||
>
|
||||
Sample Audio
|
||||
</span>
|
||||
<div
|
||||
class="flex byline"
|
||||
class="Flex-module_flex AudioPlayerView-module_byline"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<time
|
||||
@ -155,13 +155,13 @@ exports[`AudioPlayerView > renders the audio player in error state 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="audio-player-seek"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<input
|
||||
aria-label="Audio seek bar"
|
||||
class="seekBar"
|
||||
class="SeekBar-module_seekBar"
|
||||
max="100"
|
||||
min="0"
|
||||
step="1"
|
||||
@ -171,7 +171,7 @@ exports[`AudioPlayerView > renders the audio player in error state 1`] = `
|
||||
value="30"
|
||||
/>
|
||||
<time
|
||||
class="mx_Clock clock"
|
||||
class="mx_Clock AudioPlayerView-module_clock"
|
||||
datetime="PT2M"
|
||||
role="timer"
|
||||
>
|
||||
@ -180,7 +180,7 @@ exports[`AudioPlayerView > renders the audio player in error state 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<span
|
||||
class="error"
|
||||
class="AudioPlayerView-module_error"
|
||||
>
|
||||
Error downloading audio
|
||||
</span>
|
||||
@ -191,19 +191,19 @@ exports[`AudioPlayerView > renders the audio player without media name 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Audio player"
|
||||
class="mx_MediaBody mediaBody audioPlayer"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody AudioPlayerView-module_audioPlayer"
|
||||
role="region"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Play"
|
||||
aria-labelledby="_r_6_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
@ -227,17 +227,17 @@ exports[`AudioPlayerView > renders the audio player without media name 1`] = `
|
||||
</div>
|
||||
</button>
|
||||
<div
|
||||
class="flex mediaInfo"
|
||||
class="Flex-module_flex AudioPlayerView-module_mediaInfo"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="mediaName"
|
||||
class="AudioPlayerView-module_mediaName"
|
||||
data-testid="audio-player-name"
|
||||
>
|
||||
Unnamed audio
|
||||
</span>
|
||||
<div
|
||||
class="flex byline"
|
||||
class="Flex-module_flex AudioPlayerView-module_byline"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<time
|
||||
@ -251,13 +251,13 @@ exports[`AudioPlayerView > renders the audio player without media name 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="audio-player-seek"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<input
|
||||
aria-label="Audio seek bar"
|
||||
class="seekBar"
|
||||
class="SeekBar-module_seekBar"
|
||||
max="100"
|
||||
min="0"
|
||||
step="1"
|
||||
@ -267,7 +267,7 @@ exports[`AudioPlayerView > renders the audio player without media name 1`] = `
|
||||
value="30"
|
||||
/>
|
||||
<time
|
||||
class="mx_Clock clock"
|
||||
class="mx_Clock AudioPlayerView-module_clock"
|
||||
datetime="PT2M"
|
||||
role="timer"
|
||||
>
|
||||
@ -282,19 +282,19 @@ exports[`AudioPlayerView > renders the audio player without size 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Audio player"
|
||||
class="mx_MediaBody mediaBody audioPlayer"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody AudioPlayerView-module_audioPlayer"
|
||||
role="region"
|
||||
tabindex="0"
|
||||
>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-label="Play"
|
||||
aria-labelledby="_r_c_"
|
||||
class="_icon-button_1215g_8 button"
|
||||
class="_icon-button_1215g_8 PlayPauseButton-module_button"
|
||||
data-kind="primary"
|
||||
role="button"
|
||||
style="--cpd-icon-button-size: 32px;"
|
||||
@ -318,17 +318,17 @@ exports[`AudioPlayerView > renders the audio player without size 1`] = `
|
||||
</div>
|
||||
</button>
|
||||
<div
|
||||
class="flex mediaInfo"
|
||||
class="Flex-module_flex AudioPlayerView-module_mediaInfo"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: column; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: 0; --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<span
|
||||
class="mediaName"
|
||||
class="AudioPlayerView-module_mediaName"
|
||||
data-testid="audio-player-name"
|
||||
>
|
||||
Sample Audio
|
||||
</span>
|
||||
<div
|
||||
class="flex byline"
|
||||
class="Flex-module_flex AudioPlayerView-module_byline"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1-5x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<time
|
||||
@ -341,13 +341,13 @@ exports[`AudioPlayerView > renders the audio player without size 1`] = `
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="flex"
|
||||
class="Flex-module_flex"
|
||||
data-testid="audio-player-seek"
|
||||
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-1x); --mx-flex-wrap: nowrap;"
|
||||
>
|
||||
<input
|
||||
aria-label="Audio seek bar"
|
||||
class="seekBar"
|
||||
class="SeekBar-module_seekBar"
|
||||
max="100"
|
||||
min="0"
|
||||
step="1"
|
||||
@ -357,7 +357,7 @@ exports[`AudioPlayerView > renders the audio player without size 1`] = `
|
||||
value="30"
|
||||
/>
|
||||
<time
|
||||
class="mx_Clock clock"
|
||||
class="mx_Clock AudioPlayerView-module_clock"
|
||||
datetime="PT2M"
|
||||
role="timer"
|
||||
>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`DecryptionFailureBodyView > Should display "The sender has blocked you from receiving this message and device verification is false" 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
The sender has blocked you from receiving this message because your device is unverified
|
||||
</div>
|
||||
@ -13,7 +13,7 @@ exports[`DecryptionFailureBodyView > Should display "The sender has blocked you
|
||||
exports[`DecryptionFailureBodyView > Should display "The sender has blocked you from receiving this message and device verification is true" 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
The sender has blocked you from receiving this message because your device is unverified
|
||||
</div>
|
||||
@ -23,7 +23,7 @@ exports[`DecryptionFailureBodyView > Should display "The sender has blocked you
|
||||
exports[`DecryptionFailureBodyView > Should display "Unable to decrypt message and device verification is false" 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
Unable to decrypt message
|
||||
</div>
|
||||
@ -33,7 +33,7 @@ exports[`DecryptionFailureBodyView > Should display "Unable to decrypt message a
|
||||
exports[`DecryptionFailureBodyView > Should display "Unable to decrypt message and device verification is true" 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
Unable to decrypt message
|
||||
</div>
|
||||
@ -43,7 +43,7 @@ exports[`DecryptionFailureBodyView > Should display "Unable to decrypt message a
|
||||
exports[`DecryptionFailureBodyView > should handle historical messages with no key backup and device verification is false 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
Historical messages are not available on this device
|
||||
</div>
|
||||
@ -53,7 +53,7 @@ exports[`DecryptionFailureBodyView > should handle historical messages with no k
|
||||
exports[`DecryptionFailureBodyView > should handle historical messages with no key backup and device verification is true 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
Historical messages are not available on this device
|
||||
</div>
|
||||
@ -63,11 +63,11 @@ exports[`DecryptionFailureBodyView > should handle historical messages with no k
|
||||
exports[`DecryptionFailureBodyView > should handle messages from unverified devices and device verification is false 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content error"
|
||||
class="DecryptionFailureBodyView-module_content DecryptionFailureBodyView-module_error"
|
||||
>
|
||||
<span>
|
||||
<svg
|
||||
class="icon"
|
||||
class="DecryptionFailureBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="16px"
|
||||
viewBox="0 0 24 24"
|
||||
@ -87,11 +87,11 @@ exports[`DecryptionFailureBodyView > should handle messages from unverified devi
|
||||
exports[`DecryptionFailureBodyView > should handle messages from unverified devices and device verification is true 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content error"
|
||||
class="DecryptionFailureBodyView-module_content DecryptionFailureBodyView-module_error"
|
||||
>
|
||||
<span>
|
||||
<svg
|
||||
class="icon"
|
||||
class="DecryptionFailureBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="16px"
|
||||
viewBox="0 0 24 24"
|
||||
@ -111,11 +111,11 @@ exports[`DecryptionFailureBodyView > should handle messages from unverified devi
|
||||
exports[`DecryptionFailureBodyView > should handle messages from users who change identities after verification and device verification is false 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content error"
|
||||
class="DecryptionFailureBodyView-module_content DecryptionFailureBodyView-module_error"
|
||||
>
|
||||
<span>
|
||||
<svg
|
||||
class="icon"
|
||||
class="DecryptionFailureBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="16px"
|
||||
viewBox="0 0 24 24"
|
||||
@ -135,11 +135,11 @@ exports[`DecryptionFailureBodyView > should handle messages from users who chang
|
||||
exports[`DecryptionFailureBodyView > should handle messages from users who change identities after verification and device verification is true 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content error"
|
||||
class="DecryptionFailureBodyView-module_content DecryptionFailureBodyView-module_error"
|
||||
>
|
||||
<span>
|
||||
<svg
|
||||
class="icon"
|
||||
class="DecryptionFailureBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="16px"
|
||||
viewBox="0 0 24 24"
|
||||
@ -159,7 +159,7 @@ exports[`DecryptionFailureBodyView > should handle messages from users who chang
|
||||
exports[`DecryptionFailureBodyView > should handle undecryptable pre-join messages and device verification is false 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
You don't have access to this message
|
||||
</div>
|
||||
@ -169,7 +169,7 @@ exports[`DecryptionFailureBodyView > should handle undecryptable pre-join messag
|
||||
exports[`DecryptionFailureBodyView > should handle undecryptable pre-join messages and device verification is true 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="content"
|
||||
class="DecryptionFailureBodyView-module_content"
|
||||
>
|
||||
You don't have access to this message
|
||||
</div>
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`EventContentBodyView > renders HTML content correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EventTile_body markdownBody"
|
||||
class="EventContentBody-module_EventTile_body EventContentBody-module_markdownBody"
|
||||
dir="auto"
|
||||
>
|
||||
<p>
|
||||
@ -30,7 +30,7 @@ exports[`EventContentBodyView > renders HTML content correctly 1`] = `
|
||||
exports[`EventContentBodyView > renders as span when specified 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="EventTile_body"
|
||||
class="EventContentBody-module_EventTile_body"
|
||||
dir="auto"
|
||||
>
|
||||
This is rendered as a span element.
|
||||
@ -41,17 +41,17 @@ exports[`EventContentBodyView > renders as span when specified 1`] = `
|
||||
exports[`EventContentBodyView > renders big emoji correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EventTile_body EventTile_bigEmoji"
|
||||
class="EventContentBody-module_EventTile_body EventContentBody-module_EventTile_bigEmoji"
|
||||
dir="auto"
|
||||
>
|
||||
<span
|
||||
class="Emoji"
|
||||
class="EventContentBody-module_Emoji"
|
||||
title=":wave:"
|
||||
>
|
||||
👋
|
||||
</span>
|
||||
<span
|
||||
class="Emoji"
|
||||
class="EventContentBody-module_Emoji"
|
||||
title=":smile:"
|
||||
>
|
||||
😊
|
||||
@ -63,7 +63,7 @@ exports[`EventContentBodyView > renders big emoji correctly 1`] = `
|
||||
exports[`EventContentBodyView > renders code block correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EventTile_body markdownBody"
|
||||
class="EventContentBody-module_EventTile_body EventContentBody-module_markdownBody"
|
||||
dir="auto"
|
||||
>
|
||||
<pre>
|
||||
@ -80,12 +80,12 @@ exports[`EventContentBodyView > renders code block correctly 1`] = `
|
||||
exports[`EventContentBodyView > renders highlighted content correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EventTile_body"
|
||||
class="EventContentBody-module_EventTile_body"
|
||||
dir="auto"
|
||||
>
|
||||
Message with a
|
||||
<span
|
||||
class="EventTile_searchHighlight"
|
||||
class="EventContentBody-module_EventTile_searchHighlight"
|
||||
>
|
||||
highlighted
|
||||
</span>
|
||||
@ -97,7 +97,7 @@ exports[`EventContentBodyView > renders highlighted content correctly 1`] = `
|
||||
exports[`EventContentBodyView > renders plain text correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="EventTile_body"
|
||||
class="EventContentBody-module_EventTile_body"
|
||||
dir="auto"
|
||||
>
|
||||
Hello, this is a plain text message.
|
||||
|
||||
@ -3,10 +3,10 @@
|
||||
exports[`FileBodyView > matches snapshot for audio-info story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
@ -44,7 +44,7 @@ exports[`FileBodyView > matches snapshot for audio-info story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for decryption-pending-download story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
data-type="download"
|
||||
@ -78,10 +78,10 @@ exports[`FileBodyView > matches snapshot for decryption-pending-download story 1
|
||||
exports[`FileBodyView > matches snapshot for default story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
@ -144,7 +144,7 @@ exports[`FileBodyView > matches snapshot for default story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for encrypted-iframe-download story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
data-type="download"
|
||||
@ -188,13 +188,13 @@ exports[`FileBodyView > matches snapshot for encrypted-iframe-download story 1`]
|
||||
exports[`FileBodyView > matches snapshot for export story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<a
|
||||
href="https://example.org/spec.pdf"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
@ -230,10 +230,10 @@ exports[`FileBodyView > matches snapshot for export story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for invalid story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
@ -263,7 +263,7 @@ exports[`FileBodyView > matches snapshot for invalid story 1`] = `
|
||||
</div>
|
||||
</span>
|
||||
<span
|
||||
class="content invalid"
|
||||
class="FileBodyView-module_content FileBodyView-module_invalid"
|
||||
>
|
||||
Invalid file
|
||||
</span>
|
||||
@ -273,7 +273,7 @@ exports[`FileBodyView > matches snapshot for invalid story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for long-filename-download story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
data-type="download"
|
||||
@ -310,10 +310,10 @@ exports[`FileBodyView > matches snapshot for long-filename-download story 1`] =
|
||||
exports[`FileBodyView > matches snapshot for long-filename-info story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
@ -348,7 +348,7 @@ exports[`FileBodyView > matches snapshot for long-filename-info story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for unencrypted-download story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
data-type="download"
|
||||
@ -385,10 +385,10 @@ exports[`FileBodyView > matches snapshot for unencrypted-download story 1`] = `
|
||||
exports[`FileBodyView > matches snapshot for video-info story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="FileBodyView-module_content"
|
||||
>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
data-type="info"
|
||||
>
|
||||
<button
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`VideoBodyView > matches snapshot for error story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="root error"
|
||||
class="VideoBodyView-module_root VideoBodyView-module_error"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -27,18 +27,18 @@ exports[`VideoBodyView > matches snapshot for error story 1`] = `
|
||||
exports[`VideoBodyView > matches snapshot for hidden story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="root"
|
||||
class="VideoBodyView-module_root"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="VideoBodyView-module_container"
|
||||
style="width: min(100%, 320px); max-width: 320px; max-height: 180px; aspect-ratio: 16 / 9;"
|
||||
>
|
||||
<button
|
||||
class="hiddenButton"
|
||||
class="VideoBodyView-module_hiddenButton"
|
||||
type="button"
|
||||
>
|
||||
<div
|
||||
class="hiddenButtonContent"
|
||||
class="VideoBodyView-module_hiddenButtonContent"
|
||||
>
|
||||
<svg
|
||||
fill="currentColor"
|
||||
@ -64,16 +64,16 @@ exports[`VideoBodyView > matches snapshot for hidden story 1`] = `
|
||||
exports[`VideoBodyView > matches snapshot for ready story 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="root"
|
||||
class="VideoBodyView-module_root"
|
||||
>
|
||||
<div
|
||||
class="container"
|
||||
class="VideoBodyView-module_container"
|
||||
data-video-body-mask-target=""
|
||||
style="width: min(100%, 320px); max-width: 320px; max-height: 180px; aspect-ratio: 16 / 9;"
|
||||
>
|
||||
<video
|
||||
aria-label="Product demo video"
|
||||
class="video"
|
||||
class="VideoBodyView-module_video"
|
||||
controls=""
|
||||
controlslist="nodownload"
|
||||
crossorigin="anonymous"
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`MediaBody > renders the media body 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="mx_MediaBody mediaBody"
|
||||
class="mx_MediaBody MediaBody-module_mediaBody"
|
||||
>
|
||||
Media content goes here
|
||||
</div>
|
||||
|
||||
@ -3,11 +3,11 @@
|
||||
exports[`RedactedBodyView > renders the default redacted body 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="RedactedBodyView-module_content"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class="icon"
|
||||
class="RedactedBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
@ -28,11 +28,11 @@ exports[`RedactedBodyView > renders the default redacted body 1`] = `
|
||||
exports[`RedactedBodyView > renders without a tooltip when none is provided 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="content"
|
||||
class="RedactedBodyView-module_content"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class="icon"
|
||||
class="RedactedBodyView-module_icon"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
|
||||
@ -3,7 +3,7 @@
|
||||
exports[`TextualBodyView > renders caption messages with url previews 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="root caption"
|
||||
class="TextualBody-module_root TextualBody-module_caption"
|
||||
>
|
||||
<div>
|
||||
Caption for the uploaded image.
|
||||
@ -20,26 +20,26 @@ exports[`TextualBodyView > renders caption messages with url previews 1`] = `
|
||||
exports[`TextualBodyView > renders emote messages with annotations 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="root emote"
|
||||
class="TextualBody-module_root TextualBody-module_emote"
|
||||
dir="auto"
|
||||
>
|
||||
*
|
||||
<button
|
||||
class="emoteSender"
|
||||
class="TextualBody-module_emoteSender"
|
||||
type="button"
|
||||
>
|
||||
Alice
|
||||
</button>
|
||||
|
||||
<span
|
||||
class="annotated annotatedInline"
|
||||
class="TextualBody-module_annotated TextualBody-module_annotatedInline"
|
||||
dir="auto"
|
||||
>
|
||||
<span>
|
||||
waves enthusiastically
|
||||
</span>
|
||||
<button
|
||||
class="annotation editedMarker"
|
||||
class="TextualBody-module_annotation TextualBody-module_editedMarker"
|
||||
type="button"
|
||||
>
|
||||
<span>
|
||||
@ -54,7 +54,7 @@ exports[`TextualBodyView > renders emote messages with annotations 1`] = `
|
||||
exports[`TextualBodyView > renders the default message body 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="root text"
|
||||
class="TextualBody-module_root TextualBody-module_text"
|
||||
>
|
||||
<div>
|
||||
Hello, this is a textual message.
|
||||
@ -66,7 +66,7 @@ exports[`TextualBodyView > renders the default message body 1`] = `
|
||||
exports[`TextualBodyView > renders the notice branch 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="root notice"
|
||||
class="TextualBody-module_root TextualBody-module_notice"
|
||||
>
|
||||
<div>
|
||||
This is a notice message.
|
||||
|
||||
@ -4,69 +4,69 @@ exports[`ReactionsRowView > renders the default reactions row 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Reactions"
|
||||
class="reactionsRow"
|
||||
class="ReactionsRow-module_reactionsRow"
|
||||
role="toolbar"
|
||||
>
|
||||
<button
|
||||
aria-label="4 reactions for 👍"
|
||||
class="reactionsRowButton reactionsRowButtonSelected"
|
||||
class="ReactionsRowButton-module_reactionsRowButton ReactionsRowButton-module_reactionsRowButtonSelected"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👍
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
4
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
aria-label="2 reactions for 🎉"
|
||||
class="reactionsRowButton"
|
||||
class="ReactionsRowButton-module_reactionsRowButton"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
🎉
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
aria-label="1 reactions for 👀"
|
||||
class="reactionsRowButton"
|
||||
class="ReactionsRowButton-module_reactionsRowButton"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👀
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
aria-label="Add reaction"
|
||||
class="addReactionButton addReactionButtonVisible"
|
||||
class="ReactionsRow-module_addReactionButton ReactionsRow-module_addReactionButtonVisible"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
@ -92,75 +92,75 @@ exports[`ReactionsRowView > renders the row with a show-all button 1`] = `
|
||||
<div>
|
||||
<div
|
||||
aria-label="Reactions"
|
||||
class="reactionsRow"
|
||||
class="ReactionsRow-module_reactionsRow"
|
||||
role="toolbar"
|
||||
>
|
||||
<button
|
||||
aria-label="4 reactions for 👍"
|
||||
class="reactionsRowButton reactionsRowButtonSelected"
|
||||
class="ReactionsRowButton-module_reactionsRowButton ReactionsRowButton-module_reactionsRowButtonSelected"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👍
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
4
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
aria-label="2 reactions for 🎉"
|
||||
class="reactionsRowButton"
|
||||
class="ReactionsRowButton-module_reactionsRowButton"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
🎉
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
aria-label="1 reactions for 👀"
|
||||
class="reactionsRowButton"
|
||||
class="ReactionsRowButton-module_reactionsRowButton"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👀
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
1
|
||||
</span>
|
||||
</button>
|
||||
<button
|
||||
class="showAllButton"
|
||||
class="ReactionsRow-module_showAllButton"
|
||||
type="button"
|
||||
>
|
||||
Show all
|
||||
</button>
|
||||
<button
|
||||
aria-label="Add reaction"
|
||||
class="addReactionButton addReactionButtonVisible"
|
||||
class="ReactionsRow-module_addReactionButton ReactionsRow-module_addReactionButtonVisible"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
|
||||
@ -4,19 +4,19 @@ exports[`ReactionsRowButton > renders the default reaction button 1`] = `
|
||||
<div>
|
||||
<button
|
||||
aria-label="Alice and Bob reacted with 👍"
|
||||
class="reactionsRowButton"
|
||||
class="ReactionsRowButton-module_reactionsRowButton"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👍
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
@ -28,19 +28,19 @@ exports[`ReactionsRowButton > renders the selected reaction button 1`] = `
|
||||
<div>
|
||||
<button
|
||||
aria-label="Alice and Bob reacted with 👍"
|
||||
class="reactionsRowButton reactionsRowButtonSelected"
|
||||
class="ReactionsRowButton-module_reactionsRowButton ReactionsRowButton-module_reactionsRowButtonSelected"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonContent"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonContent"
|
||||
>
|
||||
👍
|
||||
</span>
|
||||
<span
|
||||
aria-hidden="true"
|
||||
class="reactionsRowButtonCount"
|
||||
class="ReactionsRowButton-module_reactionsRowButtonCount"
|
||||
>
|
||||
2
|
||||
</span>
|
||||
|
||||
@ -4,7 +4,7 @@ exports[`MessageTimestampView > renders the message timestamp in default state 1
|
||||
<div>
|
||||
<span
|
||||
aria-live="off"
|
||||
class="content"
|
||||
class="MessageTimestampView-module_content"
|
||||
tabindex="0"
|
||||
>
|
||||
04:58
|
||||
@ -16,7 +16,7 @@ exports[`MessageTimestampView > renders the message timestamp with href 1`] = `
|
||||
<div>
|
||||
<a
|
||||
aria-live="off"
|
||||
class="content"
|
||||
class="MessageTimestampView-module_content"
|
||||
href="~"
|
||||
>
|
||||
04:58
|
||||
|
||||
@ -142,8 +142,8 @@ export default defineConfig({
|
||||
},
|
||||
css: {
|
||||
modules: {
|
||||
// Stabilise snapshots by stripping the hash component of the CSS module class name
|
||||
generateScopedName: (name) => name,
|
||||
// Stabilise snapshots while keeping names distinct across CSS modules.
|
||||
generateScopedName: "[name]_[local]",
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user