Skip to content

Commit 8168c7d

Browse files
committed
fix(switch): ensure ability to set a value
1 parent 3e6bec4 commit 8168c7d

2 files changed

Lines changed: 5 additions & 2 deletions

File tree

elements/pf-v6-switch/demo/form-association.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
description: A switch can participate in forms. It submits "on" when checked and is omitted when unchecked. Use the reset button to restore the initial state.
44
---
55
<form id="settings-form">
6-
<pf-v6-switch name="notifications" checked>Notifications</pf-v6-switch>
6+
<pf-v6-switch name="notifications" checked value="im-on">Notifications</pf-v6-switch>
77
<br><br>
88
<button type="submit">Submit</button>
99
<button type="reset">Reset</button>

elements/pf-v6-switch/pf-v6-switch.ts

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,6 +47,9 @@ export class PfV6Switch extends LitElement {
4747
/** Reverses the layout so the label appears before the toggle. */
4848
@property({ reflect: true, type: Boolean }) reversed = false;
4949

50+
/** Form value defaults to undefined */
51+
@property({ type: String }) value?;
52+
5053
#initialChecked = false;
5154

5255
get #classes() {
@@ -92,7 +95,7 @@ export class PfV6Switch extends LitElement {
9295
this.#internals.ariaChecked = String(!!this.checked);
9396
this.#internals.ariaDisabled = String(!!this.disabled);
9497
this.#internals.ariaLabel = this.accessibleLabel || null;
95-
this.#internals.setFormValue(this.checked ? 'on' : null);
98+
this.#internals.setFormValue(this.checked ? (this.value ?? null) : null);
9699
}
97100

98101
override render(): TemplateResult<1> {

0 commit comments

Comments
 (0)