Update vector-im (#31306)

* Update vector-im

* Update Jest snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix playwright styling overrides

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Hold back Compound Design Tokens as threads icons unexpectedly grew a dot in the top corner where we conditionally draw a dot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update Compound Design Tokens to 6.4.1

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Revert snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Tweak bubble

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update storybook snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update jest snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update jest snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
renovate[bot]
2025-12-02 09:57:28 +00:00
committed by GitHub
parent 2e87f7cb90
commit 99178bce86
118 changed files with 736 additions and 747 deletions
@@ -28,7 +28,7 @@ exports[`<BaseCard /> should close when clicking X button 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -28,7 +28,7 @@ exports[`<ExtensionsCard /> should render empty state 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -50,7 +50,7 @@ exports[`<ExtensionsCard /> should render empty state 1`] = `
tabindex="-1"
>
<button
class="_button_vczzf_8 _has-icon_vczzf_57"
class="_button_187yx_8 _has-icon_187yx_57"
data-kind="secondary"
data-size="sm"
role="button"
@@ -129,7 +129,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -151,7 +151,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
tabindex="-1"
>
<button
class="_button_vczzf_8 _has-icon_vczzf_57"
class="_button_187yx_8 _has-icon_187yx_57"
data-kind="secondary"
data-size="sm"
role="button"
@@ -172,7 +172,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
Add extensions
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -187,7 +187,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
>
<span
aria-label="Avatar"
class="_avatar_1qbcf_8 mx_BaseAvatar mx_WidgetAvatar"
class="_avatar_zysgz_8 mx_BaseAvatar mx_WidgetAvatar"
data-color="1"
data-testid="avatar-img"
data-type="round"
@@ -196,7 +196,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
>
<img
alt=""
class="_image_1qbcf_41"
class="_image_zysgz_43"
data-type="round"
height="24px"
loading="lazy"
@@ -228,7 +228,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
>
<span
aria-label="Avatar"
class="_avatar_1qbcf_8 mx_BaseAvatar mx_WidgetAvatar"
class="_avatar_zysgz_8 mx_BaseAvatar mx_WidgetAvatar"
data-color="1"
data-testid="avatar-img"
data-type="round"
@@ -237,7 +237,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
>
<img
alt=""
class="_image_1qbcf_41"
class="_image_zysgz_43"
data-type="round"
height="24px"
loading="lazy"
@@ -28,7 +28,7 @@ exports[`<PinnedMessagesCard /> should show the empty state when there are no pi
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -110,7 +110,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -141,7 +141,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
>
<div>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -180,7 +180,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
type="button"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -211,7 +211,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
</div>
</div>
<div
class="_separator_7ckbw_8 mx_PinnedMessagesCard_Separator"
class="_separator_cqpyv_8 mx_PinnedMessagesCard_Separator"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -222,7 +222,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
>
<div>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -261,7 +261,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
type="button"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -296,7 +296,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
class="mx_PinnedMessagesCard_unpin"
>
<button
class="_button_vczzf_8"
class="_button_187yx_8"
data-kind="tertiary"
data-size="lg"
role="button"
@@ -338,7 +338,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -369,7 +369,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
>
<div>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -408,7 +408,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
type="button"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -439,7 +439,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
</div>
</div>
<div
class="_separator_7ckbw_8 mx_PinnedMessagesCard_Separator"
class="_separator_cqpyv_8 mx_PinnedMessagesCard_Separator"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -450,7 +450,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
>
<div>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar mx_PinnedEventTile_senderAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -489,7 +489,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
type="button"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -24,7 +24,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -49,7 +49,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
class="mx_RoomSummaryCard_container"
>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="1"
data-testid="avatar-img"
data-type="round"
@@ -73,7 +73,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -91,7 +91,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
Public room
</span>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -134,7 +134,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -171,7 +171,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
</section>
</header>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -205,17 +205,17 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
Favourite
</span>
<div
class="_container_19o42_10"
class="_container_udcm8_10"
>
<input
aria-hidden="true"
class="_input_19o42_24"
class="_input_udcm8_24"
id="_r_j_"
role="switch"
type="checkbox"
/>
<div
class="_ui_19o42_34"
class="_ui_udcm8_34"
/>
</div>
</div>
@@ -257,7 +257,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -464,7 +464,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -621,7 +621,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -737,7 +737,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -762,7 +762,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
class="mx_RoomSummaryCard_container"
>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="1"
data-testid="avatar-img"
data-type="round"
@@ -786,7 +786,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -804,7 +804,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
Public room
</span>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -846,7 +846,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
</section>
</header>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -880,17 +880,17 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
Favourite
</span>
<div
class="_container_19o42_10"
class="_container_udcm8_10"
>
<input
aria-hidden="true"
class="_input_19o42_24"
class="_input_udcm8_24"
id="_r_5_"
role="switch"
type="checkbox"
/>
<div
class="_ui_19o42_34"
class="_ui_udcm8_34"
/>
</div>
</div>
@@ -932,7 +932,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -1139,7 +1139,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -1296,7 +1296,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -1412,7 +1412,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -1437,7 +1437,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
class="mx_RoomSummaryCard_container"
>
<span
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="1"
data-testid="avatar-img"
data-type="round"
@@ -1461,7 +1461,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: start; --mx-flex-justify: center; --mx-flex-gap: var(--cpd-space-2x); --mx-flex-wrap: nowrap;"
>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -1479,7 +1479,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
Public room
</span>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8"
data-kind="blue"
>
<svg
@@ -1522,7 +1522,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -1559,7 +1559,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
</section>
</header>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -1593,17 +1593,17 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
Favourite
</span>
<div
class="_container_19o42_10"
class="_container_udcm8_10"
>
<input
aria-hidden="true"
class="_input_19o42_24"
class="_input_udcm8_24"
id="_r_c_"
role="switch"
type="checkbox"
/>
<div
class="_ui_19o42_34"
class="_ui_udcm8_34"
/>
</div>
</div>
@@ -1645,7 +1645,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -1852,7 +1852,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -2009,7 +2009,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
</svg>
</button>
<div
class="_separator_7ckbw_8"
class="_separator_cqpyv_8"
data-kind="primary"
data-orientation="horizontal"
role="separator"
@@ -28,7 +28,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -61,7 +61,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
<button
aria-label="Profile picture"
aria-live="off"
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -315,7 +315,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
tabindex="0"
>
<div
class="_indicator-icon_zr2a0_17"
class="_indicator-icon_147l5_17"
style="--cpd-icon-button-size: 100%;"
>
<svg
@@ -348,7 +348,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
<button
aria-label="Profile picture"
aria-live="off"
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"
@@ -24,7 +24,7 @@ exports[`<UserInfoHeaderVerificationView /> renders verified badge when user is
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;"
>
<span
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_1t12g_8 mx_UserInfo_verified_badge"
class="_typography_6v6n8_153 _font-body-sm-medium_6v6n8_41 _badge_18gm1_8 mx_UserInfo_verified_badge"
data-kind="green"
>
<svg
@@ -59,7 +59,7 @@ exports[`<UserInfoHeaderVerificationView /> renders verify button 1`] = `
class="mx_UserInfo_container_verifyButton"
>
<button
class="_button_vczzf_8 mx_UserInfo_verify_button"
class="_button_187yx_8 mx_UserInfo_verify_button"
data-kind="tertiary"
data-size="sm"
role="button"
@@ -14,7 +14,7 @@ exports[`<UserInfoHeaderView /> renders custom user identifiers in the header 1`
<button
aria-label="Profile picture"
aria-live="off"
class="_avatar_1qbcf_8 mx_BaseAvatar _avatar-imageless_1qbcf_52"
class="_avatar_zysgz_8 mx_BaseAvatar _avatar-imageless_zysgz_55"
data-color="3"
data-testid="avatar-img"
data-type="round"