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

Replace checkboxes with Compound checkboxes, and appropriately label each checkbox. (#29363)

Browse Source 
* Fix labelling of avatar menu

* Make the integration manager toggle more clear.

* fix label

* lint

* Update snapshots.

* Refactor many cases of checkbox to use the new compound component.

* Remove non-checkbox related changes

* Reset some things

* Remove usages of mx_checkbox* styling.

* Use label locators for apperance tests.

* small linter tweaks

* lint

* update screenshot

* Test updates

* lint

* Realign checkboxes for device selection.

* Fixup QuickSettings styling

* remove comment

* lint

* flex comment

* remove unused label

* remove redundant classes

* add test for spaces

* lint

* Copyright

* fixup spaces test

* spaces lint

* Replace pin with compound pin.

* Realign icons

* Remove hack for colouring icons

* Adjust existing rooms component to correctly label room.

* Add test for adding an existing room to an existing space.

* Set deterministic sort order for rooms

* lint
This commit is contained in:
Will Hunt
2025-03-20 15:35:54 +00:00
committed by GitHub
parent 170dcd1c0e
commit 599112e122
43 changed files with 2361 additions and 1436 deletions
Download Patch File Download Diff File Expand all files Collapse all files

158
test/unit-tests/components/views/elements/__snapshots__/LabelledCheckbox-test.tsx.snap
View File

@@ -2,81 +2,129 @@
exports[`<LabelledCheckbox /> should render with byline of "this is a byline" 1`] = `
<DocumentFragment>
<label
<div
class="mx_LabelledCheckbox"
>
<span
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
<form
class="_root_19upo_16"
>
<input
checked=""
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<label
for="checkbox_vY7Q4uEh9K"
<div
class="_inline-field_19upo_32"
>
<div
class="mx_Checkbox_background"
class="_inline-field-control_19upo_44"
>
<div
class="mx_Checkbox_checkmark"
/>
class="_container_1hel1_10"
>
<input
aria-describedby=":r4:"
checked=""
class="_input_1hel1_18"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<div
class="_ui_1hel1_19"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
/>
</svg>
</div>
</div>
</div>
</label>
</span>
<div
class="mx_LabelledCheckbox_labels"
>
<span
class="mx_LabelledCheckbox_label"
>
Hello world
</span>
<span
class="mx_LabelledCheckbox_byline"
>
this is a byline
</span>
</div>
</label>
<div
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="checkbox_vY7Q4uEh9K"
>
<span
class="mx_LabelledCheckbox_label"
>
Hello world
</span>
</label>
<span
class="_message_19upo_85 _help-message_19upo_91"
id=":r4:"
>
this is a byline
</span>
</div>
</div>
</form>
</div>
</DocumentFragment>
`;
exports[`<LabelledCheckbox /> should render with byline of undefined 1`] = `
<DocumentFragment>
<label
<div
class="mx_LabelledCheckbox"
>
<span
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
<form
class="_root_19upo_16"
>
<input
checked=""
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<label
for="checkbox_vY7Q4uEh9K"
<div
class="_inline-field_19upo_32"
>
<div
class="mx_Checkbox_background"
class="_inline-field-control_19upo_44"
>
<div
class="mx_Checkbox_checkmark"
/>
class="_container_1hel1_10"
>
<input
checked=""
class="_input_1hel1_18"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<div
class="_ui_1hel1_19"
>
<svg
aria-hidden="true"
fill="currentColor"
height="1em"
viewBox="0 0 24 24"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<path
d="M9.55 17.575q-.2 0-.375-.062a.9.9 0 0 1-.325-.213L4.55 13q-.274-.274-.262-.713.012-.437.287-.712a.95.95 0 0 1 .7-.275q.425 0 .7.275L9.55 15.15l8.475-8.475q.274-.275.713-.275.437 0 .712.275.275.274.275.713 0 .437-.275.712l-9.2 9.2q-.15.15-.325.212a1.1 1.1 0 0 1-.375.063"
/>
</svg>
</div>
</div>
</div>
</label>
</span>
<div
class="mx_LabelledCheckbox_labels"
>
<span
class="mx_LabelledCheckbox_label"
>
Hello world
</span>
</div>
</label>
<div
class="_inline-field-body_19upo_38"
>
<label
class="_label_19upo_59"
for="checkbox_vY7Q4uEh9K"
>
<span
class="mx_LabelledCheckbox_label"
>
Hello world
</span>
</label>
</div>
</div>
</form>
</div>
</DocumentFragment>
`;