fix(notched-outline): Use superclass properties without trailing unde…

…rscores PiperOrigin-RevId: 312740920
material-components · May 21, 2020 · 49bf31d · 49bf31d
1 parent 62abbc8
commit 49bf31d
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 14 deletions.
diff --git a/packages/mdc-notched-outline/component.ts b/packages/mdc-notched-outline/component.ts
@@ -37,17 +37,19 @@ export class MDCNotchedOutline extends MDCComponent<MDCNotchedOutlineFoundation>
   private notchElement_!: HTMLElement; // assigned in initialSyncWithDOM()
 
   initialSyncWithDOM() {
-    this.notchElement_ = this.root_.querySelector<HTMLElement>(strings.NOTCH_ELEMENT_SELECTOR)!;
+    this.notchElement_ =
+        this.root.querySelector<HTMLElement>(strings.NOTCH_ELEMENT_SELECTOR)!;
 
-    const label = this.root_.querySelector<HTMLElement>('.' + MDCFloatingLabelFoundation.cssClasses.ROOT);
+    const label = this.root.querySelector<HTMLElement>(
+        '.' + MDCFloatingLabelFoundation.cssClasses.ROOT);
     if (label) {
       label.style.transitionDuration = '0s';
-      this.root_.classList.add(cssClasses.OUTLINE_UPGRADED);
+      this.root.classList.add(cssClasses.OUTLINE_UPGRADED);
       requestAnimationFrame(() => {
         label.style.transitionDuration = '';
       });
     } else {
-      this.root_.classList.add(cssClasses.NO_LABEL);
+      this.root.classList.add(cssClasses.NO_LABEL);
     }
   }
 
@@ -56,25 +58,27 @@ export class MDCNotchedOutline extends MDCComponent<MDCNotchedOutlineFoundation>
    * @param notchWidth The notch width in the outline.
    */
   notch(notchWidth: number) {
-    this.foundation_.notch(notchWidth);
+    this.foundation.notch(notchWidth);
   }
 
   /**
    * Updates classes and styles to close the notch.
    */
   closeNotch() {
-    this.foundation_.closeNotch();
+    this.foundation.closeNotch();
   }
 
   getDefaultFoundation() {
     // DO NOT INLINE this variable. For backward compatibility, foundations take a Partial<MDCFooAdapter>.
     // To ensure we don't accidentally omit any methods, we need a separate, strongly typed adapter variable.
     // tslint:disable:object-literal-sort-keys Methods should be in the same order as the adapter interface.
     const adapter: MDCNotchedOutlineAdapter = {
-      addClass: (className) => this.root_.classList.add(className),
-      removeClass: (className) => this.root_.classList.remove(className),
-      setNotchWidthProperty: (width) => this.notchElement_.style.setProperty('width', width + 'px'),
-      removeNotchWidthProperty: () => this.notchElement_.style.removeProperty('width'),
+      addClass: (className) => this.root.classList.add(className),
+      removeClass: (className) => this.root.classList.remove(className),
+      setNotchWidthProperty: (width) =>
+          this.notchElement_.style.setProperty('width', width + 'px'),
+      removeNotchWidthProperty: () =>
+          this.notchElement_.style.removeProperty('width'),
     };
     // tslint:enable:object-literal-sort-keys
     return new MDCNotchedOutlineFoundation(adapter);

diff --git a/packages/mdc-notched-outline/foundation.ts b/packages/mdc-notched-outline/foundation.ts
@@ -66,17 +66,17 @@ export class MDCNotchedOutlineFoundation extends MDCFoundation<MDCNotchedOutline
       notchWidth += numbers.NOTCH_ELEMENT_PADDING; // Add padding from left/right.
     }
 
-    this.adapter_.setNotchWidthProperty(notchWidth);
-    this.adapter_.addClass(OUTLINE_NOTCHED);
+    this.adapter.setNotchWidthProperty(notchWidth);
+    this.adapter.addClass(OUTLINE_NOTCHED);
   }
 
   /**
    * Removes notched outline selector to close the notch in the outline.
    */
   closeNotch() {
     const {OUTLINE_NOTCHED} = MDCNotchedOutlineFoundation.cssClasses;
-    this.adapter_.removeClass(OUTLINE_NOTCHED);
-    this.adapter_.removeNotchWidthProperty();
+    this.adapter.removeClass(OUTLINE_NOTCHED);
+    this.adapter.removeNotchWidthProperty();
   }
 }