From 10a6d353fc124ebb6a728b275a68dd966ed6aa8f Mon Sep 17 00:00:00 2001
From: Material Web Team <material-web-copybara@google.com>
Date: Fri, 22 Jul 2022 15:26:44 -0700
Subject: [PATCH] refactor: mark `disabled` and `checked` as boolean values in
 lit templates.

PiperOrigin-RevId: 462716556
---
 button/lib/button.ts                      | 2 +-
 checkbox/lib/checkbox.ts                  | 4 ++--
 fab/lib/fab-shared.ts                     | 2 +-
 field/test/field_test.ts                  | 2 +-
 field/test/filled-field_test.ts           | 2 +-
 field/test/outlined-field_test.ts         | 2 +-
 iconbutton/lib/icon-button-toggle.ts      | 2 +-
 iconbutton/lib/icon-button.ts             | 2 +-
 radio/lib/radio.ts                        | 6 +++---
 segmented_button/lib/segmented-button.ts  | 4 ++--
 switch/lib/switch.ts                      | 4 ++--
 textfield/filled-text-field.ts            | 2 +-
 textfield/lib/filled-text-field_test.ts   | 2 +-
 textfield/lib/outlined-text-field_test.ts | 2 +-
 textfield/lib/text-field_test.ts          | 2 +-
 textfield/outlined-text-field.ts          | 2 +-
 16 files changed, 21 insertions(+), 21 deletions(-)

diff --git a/button/lib/button.ts b/button/lib/button.ts
index 1286fed22e..aa13438d7c 100644
--- a/button/lib/button.ts
+++ b/button/lib/button.ts
@@ -119,7 +119,7 @@ export abstract class Button extends ActionElement implements ButtonState {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult|string {
-    return html`<md-ripple class="md3-button__ripple" .disabled="${
+    return html`<md-ripple class="md3-button__ripple" ?disabled="${
         this.disabled}"></md-ripple>`;
   }
 
diff --git a/checkbox/lib/checkbox.ts b/checkbox/lib/checkbox.ts
index b152f71bc1..ce9f596c51 100644
--- a/checkbox/lib/checkbox.ts
+++ b/checkbox/lib/checkbox.ts
@@ -103,7 +103,7 @@ export class Checkbox extends ActionElement {
   /** @soyTemplate */
   protected renderRipple(): TemplateResult {
     return html`<md-ripple
-        .disabled="${this.disabled}"
+        ?disabled="${this.disabled}"
         unbounded></md-ripple>`;
   }
 
@@ -158,7 +158,7 @@ export class Checkbox extends ActionElement {
               data-indeterminate="${this.indeterminate ? 'true' : 'false'}"
               ?disabled="${this.disabled}"
               .indeterminate="${this.indeterminate}"
-              .checked="${this.checked}"
+              ?checked="${this.checked}"
               .value="${this.value}"
               @change="${this.handleChange}"
               @focus="${this.handleFocus}"
diff --git a/fab/lib/fab-shared.ts b/fab/lib/fab-shared.ts
index c6995cd652..c3d79da3ef 100644
--- a/fab/lib/fab-shared.ts
+++ b/fab/lib/fab-shared.ts
@@ -93,7 +93,7 @@ export abstract class FabShared extends ActionElement {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult {
-    return html`<md-ripple class="md3-fab__ripple" .disabled="${
+    return html`<md-ripple class="md3-fab__ripple" ?disabled="${
         this.disabled}"></md-ripple>`;
   }
 
diff --git a/field/test/field_test.ts b/field/test/field_test.ts
index 6e4a675d4e..1a05a969d2 100644
--- a/field/test/field_test.ts
+++ b/field/test/field_test.ts
@@ -65,7 +65,7 @@ describe('Field', () => {
           return html`
             <md-test-field
               .label=${props.label}
-              .disabled=${props.disabled ?? false}
+              ?disabled=${props.disabled ?? false}
               .error=${props.error ?? false}
               .populated=${props.populated ?? false}
               .required=${props.required ?? false}
diff --git a/field/test/filled-field_test.ts b/field/test/filled-field_test.ts
index b5a1cadbee..9cfce7ab6b 100644
--- a/field/test/filled-field_test.ts
+++ b/field/test/filled-field_test.ts
@@ -60,7 +60,7 @@ describe('Field', () => {
             return html`
               <md-test-filled-field
                 .label=${props.label}
-                .disabled=${props.disabled ?? false}
+                ?disabled=${props.disabled ?? false}
                 .error=${props.error ?? false}
                 .populated=${props.populated ?? false}
                 .required=${props.required ?? false}
diff --git a/field/test/outlined-field_test.ts b/field/test/outlined-field_test.ts
index dcb6c9b2ea..46e5755102 100644
--- a/field/test/outlined-field_test.ts
+++ b/field/test/outlined-field_test.ts
@@ -45,7 +45,7 @@ describe('Field', () => {
             return html`
               <md-test-outlined-field
                 .label=${props.label}
-                .disabled=${props.disabled ?? false}
+                ?disabled=${props.disabled ?? false}
                 .error=${props.error ?? false}
                 .populated=${props.populated ?? false}
                 .required=${props.required ?? false}
diff --git a/iconbutton/lib/icon-button-toggle.ts b/iconbutton/lib/icon-button-toggle.ts
index e2fa5c9ad5..a6e615d27a 100644
--- a/iconbutton/lib/icon-button-toggle.ts
+++ b/iconbutton/lib/icon-button-toggle.ts
@@ -56,7 +56,7 @@ export abstract class IconButtonToggle extends ActionElement {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult {
-    return html`<md-ripple .disabled="${
+    return html`<md-ripple ?disabled="${
         this.disabled}" unbounded> </md-ripple>`;
   }
 
diff --git a/iconbutton/lib/icon-button.ts b/iconbutton/lib/icon-button.ts
index 109ae1c314..e79dfc65df 100644
--- a/iconbutton/lib/icon-button.ts
+++ b/iconbutton/lib/icon-button.ts
@@ -44,7 +44,7 @@ export abstract class IconButton extends ActionElement {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult|string {
-    return html`<md-ripple .disabled="${
+    return html`<md-ripple ?disabled="${
         this.disabled}" unbounded> </md-ripple>`;
   }
 
diff --git a/radio/lib/radio.ts b/radio/lib/radio.ts
index a1d8a28e68..19bce58cf3 100644
--- a/radio/lib/radio.ts
+++ b/radio/lib/radio.ts
@@ -126,8 +126,8 @@ export class Radio extends ActionElement {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult|string {
-    return html`<md-ripple unbounded 
-        .disabled="${this.disabled}"></md-ripple>`;
+    return html`<md-ripple unbounded
+        ?disabled="${this.disabled}"></md-ripple>`;
   }
 
   /** @soyTemplate */
@@ -248,7 +248,7 @@ export class Radio extends ActionElement {
           aria-label="${ifDefined(this.ariaLabel)}"
           aria-labelledby="${ifDefined(this.ariaLabelledBy)}"
           aria-describedby="${ifDefined(this.ariaDescribedBy)}"
-          .checked="${this.checked}"
+          ?checked="${this.checked}"
           .value="${this.value}"
           ?disabled="${this.disabled}"
           @change="${this.changeHandler}"
diff --git a/segmented_button/lib/segmented-button.ts b/segmented_button/lib/segmented-button.ts
index 7d20057282..e7ed26c17d 100644
--- a/segmented_button/lib/segmented-button.ts
+++ b/segmented_button/lib/segmented-button.ts
@@ -114,7 +114,7 @@ export class SegmentedButton extends ActionElement {
         tabindex="${this.disabled ? '-1' : '0'}"
         aria-label="${ifDefined(this.ariaLabel)}"
         aria-pressed=${this.selected}
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         @focus="${this.handleFocus}"
         @blur="${this.handleBlur}"
         @pointerdown="${this.handlePointerDown}"
@@ -159,7 +159,7 @@ export class SegmentedButton extends ActionElement {
 
   /** @soyTemplate */
   protected renderRipple(): TemplateResult|string {
-    return html`<md-ripple .disabled="${
+    return html`<md-ripple ?disabled="${
         this.disabled}" class="md3-segmented-button__ripple"> </md-ripple>`;
   }
 
diff --git a/switch/lib/switch.ts b/switch/lib/switch.ts
index 48b4d81e18..154f3a5206 100644
--- a/switch/lib/switch.ts
+++ b/switch/lib/switch.ts
@@ -75,7 +75,7 @@ export class Switch extends ActionElement {
         aria-checked="${this.selected}"
         aria-label="${ifDefined(ariaLabelValue)}"
         aria-labelledby="${ifDefined(ariaLabelledByValue)}"
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         @click=${this.handleClick}
         @focus="${this.handleFocus}"
         @blur="${this.handleBlur}"
@@ -95,7 +95,7 @@ export class Switch extends ActionElement {
         type="checkbox"
         aria-hidden="true"
         name="${this.name}"
-        .checked=${this.selected}
+        ?checked=${this.selected}
         .value=${this.value}
       >
     `;
diff --git a/textfield/filled-text-field.ts b/textfield/filled-text-field.ts
index 2ecd825946..7e26c7ea43 100644
--- a/textfield/filled-text-field.ts
+++ b/textfield/filled-text-field.ts
@@ -37,7 +37,7 @@ export class MdFilledTextField extends FilledTextField {
       <md-filled-field
         class="md3-text-field__field"
         id=${this.fieldId}
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         .error=${this.error}
         .label=${this.label}
         .populated=${!!this.value}
diff --git a/textfield/lib/filled-text-field_test.ts b/textfield/lib/filled-text-field_test.ts
index 76faac86e9..e7fdb9ede6 100644
--- a/textfield/lib/filled-text-field_test.ts
+++ b/textfield/lib/filled-text-field_test.ts
@@ -28,7 +28,7 @@ class TestTextField extends FilledTextField {
       <md-filled-field
         class="md3-text-field__field"
         id=${this.fieldId}
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         .error=${this.error}
         .label=${this.label}
         .populated=${Boolean(this.value)}
diff --git a/textfield/lib/outlined-text-field_test.ts b/textfield/lib/outlined-text-field_test.ts
index dcd1eaffc2..c473ef3f54 100644
--- a/textfield/lib/outlined-text-field_test.ts
+++ b/textfield/lib/outlined-text-field_test.ts
@@ -28,7 +28,7 @@ class TestTextField extends OutlinedTextField {
        <md-outlined-field
          class="md3-text-field__field"
          id=${this.fieldId}
-         .disabled=${this.disabled}
+         ?disabled=${this.disabled}
          .error=${this.error}
          .label=${this.label}
          .populated=${Boolean(this.value)}
diff --git a/textfield/lib/text-field_test.ts b/textfield/lib/text-field_test.ts
index cecb5b3544..1245fbe44e 100644
--- a/textfield/lib/text-field_test.ts
+++ b/textfield/lib/text-field_test.ts
@@ -32,7 +32,7 @@ class TestTextField extends TextField {
       <md-filled-field
         class="md3-text-field__field"
         id=${this.fieldId}
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         .error=${this.error}
         .label=${this.label}
         .populated=${Boolean(this.value)}
diff --git a/textfield/outlined-text-field.ts b/textfield/outlined-text-field.ts
index 51a99a3589..d15008d937 100644
--- a/textfield/outlined-text-field.ts
+++ b/textfield/outlined-text-field.ts
@@ -37,7 +37,7 @@ export class MdOutlinedTextField extends OutlinedTextField {
       <md-outlined-field
         class="md3-text-field__field"
         id=${this.fieldId}
-        .disabled=${this.disabled}
+        ?disabled=${this.disabled}
         .error=${this.error}
         .label=${this.label}
         .populated=${!!this.value}