diff --git a/checkbox/lib/checkbox.ts b/checkbox/lib/checkbox.ts
index 96053fd646..7a1dd0c223 100644
--- a/checkbox/lib/checkbox.ts
+++ b/checkbox/lib/checkbox.ts
@@ -12,18 +12,23 @@ import {property, query, queryAsync, state} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
 import {when} from 'lit/directives/when.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';
 import {FormController, getFormValue} from '../../controller/form-controller.js';
 import {stringConverter} from '../../controller/string-converter.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * A checkbox component.
  */
 export class Checkbox extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   /**
    * @nocollapse
    */
@@ -70,10 +75,6 @@ export class Checkbox extends LitElement {
     return this.closest('form');
   }
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   @state() private prevChecked = false;
   @state() private prevDisabled = false;
   @state() private prevIndeterminate = false;
@@ -135,6 +136,8 @@ export class Checkbox extends LitElement {
       'prev-disabled': this.prevDisabled,
     });
 
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <div class="container ${containerClasses}">
         <div class="outline"></div>
@@ -148,7 +151,7 @@ export class Checkbox extends LitElement {
       </div>
       <input type="checkbox"
         aria-checked=${isIndeterminate ? 'mixed' : nothing}
-        aria-label=${this.ariaLabel || nothing}
+        aria-label=${ariaLabel || nothing}
         ?disabled=${this.disabled}
         .indeterminate=${this.indeterminate}
         .checked=${this.checked}
diff --git a/circularprogress/lib/circular-progress.ts b/circularprogress/lib/circular-progress.ts
index cebfd75439..0e0e8040db 100644
--- a/circularprogress/lib/circular-progress.ts
+++ b/circularprogress/lib/circular-progress.ts
@@ -8,12 +8,17 @@ import {html, LitElement, nothing, TemplateResult} from 'lit';
 import {property} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * Circular Progress component.
  */
 export class CircularProgress extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   /**
    * Progress to display, a fraction between 0 and 1.
    */
@@ -32,22 +37,19 @@ export class CircularProgress extends LitElement {
    */
   @property({type: Boolean, attribute: 'four-color'}) fourColor = false;
 
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  override ariaLabel!: string;
-
   protected override render(): TemplateResult {
     const classes = {
       'indeterminate': this.indeterminate,
       'four-color': this.fourColor
     };
 
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <div
         class="circular-progress ${classMap(classes)}"
         role="progressbar"
-        aria-label="${this.ariaLabel || nothing}"
+        aria-label="${ariaLabel || nothing}"
         aria-valuemin="0"
         aria-valuemax="1"
         aria-valuenow="${this.indeterminate ? nothing : this.progress}">
@@ -58,7 +60,7 @@ export class CircularProgress extends LitElement {
       <slot></slot>`;
   }
 
-  // Determinate mode is rendered with an svg so the progress arc can be 
+  // Determinate mode is rendered with an svg so the progress arc can be
   // easily animated via stroke-dashoffset.
   protected renderDeterminateContainer() {
     const dashOffset = (1 - this.progress) * 100;
@@ -72,10 +74,10 @@ export class CircularProgress extends LitElement {
     </svg>`;
   }
 
-  // Indeterminate mode rendered with 2 bordered-divs. The borders are 
+  // Indeterminate mode rendered with 2 bordered-divs. The borders are
   // clipped into half circles by their containers. The divs are then carefully
   // animated to produce changes to the spinner arc size.
-  // This approach has 4.5x the FPS of rendering via svg on Chrome 111. 
+  // This approach has 4.5x the FPS of rendering via svg on Chrome 111.
   // See https://lit.dev/playground/#gist=febb773565272f75408ab06a0eb49746.
   protected renderIndeterminateContainer() {
     return html`
@@ -88,4 +90,4 @@ export class CircularProgress extends LitElement {
         </div>
       </div>`;
   }
-}
\ No newline at end of file
+}
diff --git a/decorators/aria-property.ts b/decorators/aria-property.ts
deleted file mode 100644
index 73f1951a2d..0000000000
--- a/decorators/aria-property.ts
+++ /dev/null
@@ -1,105 +0,0 @@
-/**
- * @license
- * Copyright 2021 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-import {ReactiveElement} from 'lit';
-
-/**
- * A property decorator that helps proxy an aria attribute to an internal node.
- *
- * This decorator is only intended for use with ARIAMixin properties,
- * such as `ariaLabel`, to help with screen readers.
- *
- * This decorator will remove the host `aria-*` attribute at runtime and add it
- * to a `data-aria-*` attribute to avoid screenreader conflicts between the
- * host and internal node.
- *
- * `@ariaProperty` decorated properties should sync with LitElement to the
- * `data-aria-*` attribute, not the native `aria-*` attribute.
- *
- * @example
- * ```ts
- * class MyElement extends LitElement {
- *   \@ariaProperty
- *   \@property({attribute: 'data-aria-label', noAccessor: true})
- *   ariaLabel!: string;
- * }
- * ```
- * @category Decorator
- * @ExportDecoratedItems
- */
-export function ariaProperty<E extends ReactiveElement, K extends keyof E&
-                             (`aria${string}` | 'role')>(
-    prototype: E, property: K) {
-  // Replace the ARIAMixin property with data-* attribute syncing instead of
-  // using the native aria-* attribute reflection. This preserves the attribute
-  // for SSR and avoids screenreader conflicts after delegating the attribute
-  // to a child node.
-  Object.defineProperty(prototype, property, {
-    configurable: true,
-    enumerable: true,
-    get(this: ReactiveElement) {
-      return this.dataset[property] ?? '';
-    },
-    set(this: ReactiveElement, value: unknown) {
-      // Coerce non-string values to a string
-      const strValue = String(value ?? '');
-      if (strValue) {
-        this.dataset[property] = strValue;
-      } else {
-        delete this.dataset[property];
-      }
-
-      // lit will call this setter whenever the data-* attribute changes.
-      // However, this.dataset[property] will automatically be updated to the
-      // current value. To avoid bugs, always request an update regardless of
-      // the old value.
-      this.requestUpdate();
-    }
-  });
-
-  // Define an internal property that syncs from the `aria-*` attribute with lit
-  // and delegates to the real ARIAMixin property, which renders an update.
-  // This property will immediately remove the `aria-*` attribute, which doesn't
-  // work well with SSR (which is why there's a separate synced property).
-  const internalAriaProperty = Symbol(property);
-  // "ariaLabel" -> "aria-label" / "ariaLabelledBy" -> "aria-labelledby"
-  const ariaAttribute = property.replace('aria', 'aria-').toLowerCase();
-  const constructor = (prototype.constructor as typeof ReactiveElement);
-  let removingAttribute = false;
-  Object.defineProperty(prototype, internalAriaProperty, {
-    get(this: ReactiveElement) {
-      // tslint is failing here, but the types are correct (ARIAMixin
-      // properties do not obfuscate with closure)
-      // tslint:disable-next-line:no-dict-access-on-struct-type
-      return (this as E)[property];
-    },
-    set(this: ReactiveElement, value: E[K]) {
-      if (removingAttribute) {
-        // Ignore this update, which is triggered below
-        return;
-      }
-
-      // Set the ARIAMixin property, which will sync the `data-*` attribute
-      // and trigger rendering if the value changed.
-      // tslint is failing here, but the types are correct (ARIAMixin
-      // properties do not obfuscate with closure)
-      // tslint:disable-next-line:no-dict-access-on-struct-type
-      (this as E)[property] = value;
-      // Remove the `aria-*` attribute, which will call this setter again with
-      // the incorrect value. Ignore these updates.
-      removingAttribute = true;
-      this.removeAttribute(ariaAttribute);
-      removingAttribute = false;
-    }
-  });
-
-  // Tell lit to observe the `aria-*` attribute and set the internal property,
-  // which acts as a "aria-* attribute changed" observer.
-  constructor.createProperty(internalAriaProperty, {
-    attribute: ariaAttribute,
-    noAccessor: true,
-  });
-}
diff --git a/decorators/test/aria-property_test.ts b/decorators/test/aria-property_test.ts
deleted file mode 100644
index b9be655b92..0000000000
--- a/decorators/test/aria-property_test.ts
+++ /dev/null
@@ -1,103 +0,0 @@
-/**
- * @license
- * Copyright 2021 Google LLC
- * SPDX-License-Identifier: Apache-2.0
- */
-
-// import 'jasmine'; (google3-only)
-
-import {html, LitElement} from 'lit';
-import {customElement, property, query} from 'lit/decorators.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
-
-import {Environment} from '../../testing/environment.js';
-import {ariaProperty} from '../aria-property.js';
-
-describe('@ariaProperty', () => {
-  const env = new Environment();
-
-  @customElement('my-element')
-  class MyElement extends LitElement {
-    @property({attribute: 'data-aria-label', noAccessor: true})
-    @ariaProperty  // tslint:disable-line:no-new-decorators
-    override ariaLabel!: string;
-
-    @query('.root') labelledElement!: HTMLElement;
-
-    override render() {
-      return html`<div class="root"
-        aria-label=${ifDefined(this.ariaLabel)}></div>`;
-    }
-  }
-
-  let element: MyElement;
-
-  beforeEach(async () => {
-    const root = env.render(html`<my-element></my-element>`);
-    await env.waitForStability();
-    element = root.querySelector('my-element') as MyElement;
-  });
-
-  it('should set `ariaX` from `data-*` attribute', () => {
-    const value = 'Aria label';
-    element.setAttribute('data-aria-label', value);
-    expect(element.ariaLabel).toBe(value);
-  });
-
-  it('should set `data-*` attribute from `ariaX`', () => {
-    const value = 'Aria label';
-    element.ariaLabel = value;
-    expect(element.getAttribute('data-aria-label')).toBe(value);
-  });
-
-  it('should remove `data-*` attribute when set to an empty string',
-     async () => {
-       element.ariaLabel = 'Aria label';
-       element.ariaLabel = '';
-       expect(element.hasAttribute('data-aria-label'))
-           .withContext('should not have data-aria-label attribute')
-           .toBeFalse();
-     });
-
-  it('should set `ariaX` from `aria-*` attribute', () => {
-    const value = 'Aria label';
-    element.setAttribute('aria-label', value);
-    expect(element.ariaLabel).toBe(value);
-  });
-
-  it('should remove `aria-*` attribute when set and keep `ariaX` value', () => {
-    const value = 'Aria label';
-    element.setAttribute('aria-label', value);
-    expect(element.hasAttribute('aria-label'))
-        .withContext('should not have aria-label attribute')
-        .toBeFalse();
-    expect(element.ariaLabel).toBe(value);
-  });
-
-  it('should delegate to rendered elements after updateComplete', async () => {
-    const value = 'Aria label';
-    element.ariaLabel = value;
-    await element.updateComplete;
-    expect(element.labelledElement.getAttribute('aria-label')).toBe(value);
-  });
-
-  it('`ariaX` should coerce non-string values to strings', () => {
-    (element as any).ariaLabel = null;
-    expect(element.ariaLabel).withContext('null should coerce to ""').toBe('');
-
-    (element as any).ariaLabel = undefined;
-    expect(element.ariaLabel)
-        .withContext('undefined should coerce to ""')
-        .toBe('');
-
-    (element as any).ariaLabel = 42;
-    expect(element.ariaLabel)
-        .withContext('number should coerce to string')
-        .toBe('42');
-
-    (element as any).ariaLabel = true;
-    expect(element.ariaLabel)
-        .withContext('boolean should coerce to string')
-        .toBe('true');
-  });
-});
diff --git a/fab/lib/shared.ts b/fab/lib/shared.ts
index ae66d7f838..7dac077722 100644
--- a/fab/lib/shared.ts
+++ b/fab/lib/shared.ts
@@ -4,9 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// This is required for @ariaProperty
-// tslint:disable:no-new-decorators
-
 import '../../elevation/elevation.js';
 import '../../focus/focus-ring.js';
 import '../../ripple/ripple.js';
@@ -16,10 +13,11 @@ import {property, queryAsync, state} from 'lit/decorators.js';
 import {ClassInfo, classMap} from 'lit/directives/class-map.js';
 import {when} from 'lit/directives/when.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * Sizes variants available to non-extended FABs.
@@ -28,14 +26,15 @@ export type FabSize = 'medium'|'small'|'large';
 
 // tslint:disable-next-line:enforce-comments-on-exported-symbols
 export abstract class SharedFab extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions: ShadowRootInit = {
     mode: 'open' as const,
     delegatesFocus: true,
   };
 
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  @ariaProperty
-  override ariaLabel!: string;
   /**
    * The size of the FAB.
    *
@@ -71,13 +70,15 @@ export abstract class SharedFab extends LitElement {
   };
 
   protected override render(): TemplateResult {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <button
           class="fab ${classMap(this.getRenderClasses())}"
-          aria-label="${this.ariaLabel || nothing}"
-          @focus="${this.handleFocus}"
-          @blur="${this.handleBlur}"
-          @pointerdown="${this.handlePointerDown}"
+          aria-label=${ariaLabel || nothing}
+          @focus=${this.handleFocus}
+          @blur=${this.handleBlur}
+          @pointerdown=${this.handlePointerDown}
           ${ripple(this.getRipple)}>
         ${this.renderElevation()}
         ${this.renderFocusRing()}
diff --git a/iconbutton/lib/icon-button.ts b/iconbutton/lib/icon-button.ts
index 8c4580364d..32599fc3ca 100644
--- a/iconbutton/lib/icon-button.ts
+++ b/iconbutton/lib/icon-button.ts
@@ -4,9 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// This is required for @ariaProperty
-// tslint:disable:no-new-decorators
-
 import '../../focus/focus-ring.js';
 import '../../icon/icon.js';
 import '../../ripple/ripple.js';
@@ -17,17 +14,21 @@ import {ClassInfo, classMap} from 'lit/directives/class-map.js';
 import {when} from 'lit/directives/when.js';
 import {html as staticHtml, literal} from 'lit/static-html.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {isRtl} from '../../controller/is-rtl.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
-import {ARIAExpanded, ARIAHasPopup} from '../../types/aria.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 type LinkTarget = '_blank'|'_parent'|'_self'|'_top';
 
 // tslint:disable-next-line:enforce-comments-on-exported-symbols
 export class IconButton extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   /**
    * Disables the icon button and makes it non-interactive.
    */
@@ -38,18 +39,6 @@ export class IconButton extends LitElement {
    */
   @property({type: Boolean}) flipIconInRtl = false;
 
-  @ariaProperty
-  @property({attribute: 'data-aria-label'})
-  override ariaLabel!: string;
-
-  @ariaProperty
-  @property({attribute: 'data-aria-haspopup'})
-  override ariaHasPopup!: ARIAHasPopup;
-
-  @ariaProperty
-  @property({attribute: 'data-aria-expanded'})
-  override ariaExpanded!: ARIAExpanded;
-
   /**
    * Sets the underlying `HTMLAnchorElement`'s `href` resource attribute.
    */
@@ -110,19 +99,21 @@ export class IconButton extends LitElement {
 
   protected override render(): TemplateResult {
     const tag = this.href ? literal`div` : literal`button`;
-    const hasToggledAriaLabel = this.ariaLabel && this.selectedAriaLabel;
+    // Needed for closure conformance
+    const {ariaLabel, ariaHasPopup, ariaExpanded} = this as ARIAMixinStrict;
+    const hasToggledAriaLabel = ariaLabel && this.selectedAriaLabel;
     const ariaPressedValue = hasToggledAriaLabel ? nothing : this.selected;
-    let ariaLabelValue: string|typeof nothing = nothing;
+    let ariaLabelValue: string|null|typeof nothing = nothing;
     if (!this.href) {
       ariaLabelValue = (hasToggledAriaLabel && this.selected) ?
           this.selectedAriaLabel :
-          this.ariaLabel;
+          ariaLabel;
     }
     return staticHtml`<${tag}
         class="md3-icon-button ${classMap(this.getRenderClasses())}"
         aria-label="${ariaLabelValue || nothing}"
-        aria-haspopup="${!this.href && this.ariaHasPopup || nothing}"
-        aria-expanded="${!this.href && this.ariaExpanded || nothing}"
+        aria-haspopup="${!this.href && ariaHasPopup || nothing}"
+        aria-expanded="${!this.href && ariaExpanded || nothing}"
         aria-pressed="${ariaPressedValue}"
         ?disabled="${!this.href && this.disabled}"
         @focus="${this.handleFocus}"
@@ -140,11 +131,13 @@ export class IconButton extends LitElement {
   }
 
   protected renderLink() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`<a class="md3-icon-button__link" href="${this.href}"
                   target="${this.target as LinkTarget || nothing}"
                   @focus="${this.handleFocus}"
                   @blur="${this.handleBlur}"
-                  aria-label="${this.ariaLabel || nothing}"></a>`;
+                  aria-label="${ariaLabel || nothing}"></a>`;
   }
 
   protected getRenderClasses(): ClassInfo {
diff --git a/linearprogress/lib/linear-progress.ts b/linearprogress/lib/linear-progress.ts
index d5b72096df..3732c0a1ff 100644
--- a/linearprogress/lib/linear-progress.ts
+++ b/linearprogress/lib/linear-progress.ts
@@ -9,12 +9,17 @@ import {property, query, state} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
 import {styleMap} from 'lit/directives/style-map.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * LinearProgress component.
  */
 export class LinearProgress extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   /**
    * Whether or not to render indeterminate progress in an animated state.
    */
@@ -36,11 +41,6 @@ export class LinearProgress extends LitElement {
    */
   @property({type: Boolean, attribute: 'four-colors'}) fourColors = false;
 
-  @property({type: String, attribute: 'data-aria-label', noAccessor: true})
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  override ariaLabel!: string;
-
   @query('.linear-progress') protected rootEl!: HTMLElement;
 
   @state() protected animationReady = true;
@@ -63,11 +63,13 @@ export class LinearProgress extends LitElement {
       transform: `scaleX(${(this.indeterminate ? 1 : this.buffer) * 100}%)`
     };
 
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <div
           role="progressbar"
           class="linear-progress ${classMap(rootClasses)}"
-          aria-label="${this.ariaLabel || nothing}"
+          aria-label="${ariaLabel || nothing}"
           aria-valuemin="0"
           aria-valuemax="1"
           aria-valuenow="${this.indeterminate ? nothing : this.progress}">
@@ -114,4 +116,4 @@ export class LinearProgress extends LitElement {
     this.animationReady = true;
     await this.updateComplete;
   }
-}
\ No newline at end of file
+}
diff --git a/list/lib/list.ts b/list/lib/list.ts
index fbe614fa23..e0da0ed3aa 100644
--- a/list/lib/list.ts
+++ b/list/lib/list.ts
@@ -4,17 +4,13 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// Required for @ariaProperty
-// tslint:disable:no-new-decorators
-
 import {html, LitElement, nothing, TemplateResult} from 'lit';
 import {property, query, queryAssignedElements} from 'lit/decorators.js';
 import {ClassInfo, classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {keydownHandler} from '../../focus/strong-focus.js';
-import {ARIARole} from '../../types/aria.js';
+import {ARIAMixinStrict, ARIARole} from '../../types/aria.js';
 
 import {ListItem} from './listitem/list-item.js';
 
@@ -35,23 +31,19 @@ function isNavigableKey(key: string): key is NavigatableValues {
 
 // tslint:disable-next-line:enforce-comments-on-exported-symbols
 export class List extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions:
       ShadowRootInit = {mode: 'open', delegatesFocus: true};
 
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
-  @ariaProperty
-  @property({attribute: 'data-aria-activedescendant', noAccessor: true})
-  ariaActivedescendant!: string;
-
   @property() type: ARIARole|'' = 'list';
 
   /**
    * The tabindex of the underlying list.
    */
-  @property({type: Number}) listTabIndex: number = 0;
+  @property({type: Number}) listTabIndex = 0;
 
   @query('.md3-list') listRoot!: HTMLElement;
 
@@ -74,9 +66,11 @@ export class List extends LitElement {
    * Renders the main list element.
    */
   protected renderList() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
     <ul class="md3-list ${classMap(this.getListClasses())}"
-        aria-label="${ifDefined(this.ariaLabel)}"
+        aria-label=${ariaLabel || nothing}
         tabindex=${this.listTabIndex}
         role=${this.type || nothing}
         @keydown=${this.handleKeydown}
diff --git a/list/lib/listitem/list-item.ts b/list/lib/listitem/list-item.ts
index 9e0c911a78..18b2e2e7ba 100644
--- a/list/lib/listitem/list-item.ts
+++ b/list/lib/listitem/list-item.ts
@@ -4,9 +4,6 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// Required for @ariaProperty
-// tslint:disable:no-new-decorators
-
 import '../../../ripple/ripple.js';
 import '../../../focus/focus-ring.js';
 
@@ -14,11 +11,11 @@ import {html, LitElement, nothing, PropertyValues, TemplateResult} from 'lit';
 import {property, query, queryAsync, state} from 'lit/decorators.js';
 import {ClassInfo, classMap} from 'lit/directives/class-map.js';
 
-import {ariaProperty} from '../../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../../aria/delegate.js';
 import {pointerPress, shouldShowStrongFocus} from '../../../focus/strong-focus.js';
 import {ripple} from '../../../ripple/directive.js';
 import {MdRipple} from '../../../ripple/ripple.js';
-import {ARIARole} from '../../../types/aria.js';
+import {ARIAMixinStrict, ARIARole} from '../../../types/aria.js';
 
 interface ListItemSelf {
   active: boolean;
@@ -33,12 +30,9 @@ export type ListItem = ListItemSelf&HTMLElement;
 
 // tslint:disable-next-line:enforce-comments-on-exported-symbols
 export class ListItemEl extends LitElement implements ListItem {
-  @ariaProperty
-  @property({attribute: 'data-aria-selected', noAccessor: true})
-  override ariaSelected!: 'true'|'false';
-  @ariaProperty
-  @property({attribute: 'data-aria-checked', noAccessor: true})
-  override ariaChecked!: 'true'|'false';
+  static {
+    requestUpdateOnAriaChange(this);
+  }
 
   /**
    * The primary, headline text of the list item.
@@ -148,8 +142,8 @@ export class ListItemEl extends LitElement implements ListItem {
       <li
           tabindex=${this.disabled ? -1 : this.itemTabIndex}
           role=${this.listItemRole}
-          aria-selected=${this.ariaSelected || nothing}
-          aria-checked=${this.ariaChecked || nothing}
+          aria-selected=${(this as ARIAMixinStrict).ariaSelected || nothing}
+          aria-checked=${(this as ARIAMixinStrict).ariaChecked || nothing}
           class="list-item ${classMap(this.getRenderClasses())}"
           @pointerdown=${this.onPointerdown}
           @focus=${this.onFocus}
diff --git a/list/lib/listitemlink/list-item-link.ts b/list/lib/listitemlink/list-item-link.ts
index d02046cfff..64c2fcdb1f 100644
--- a/list/lib/listitemlink/list-item-link.ts
+++ b/list/lib/listitemlink/list-item-link.ts
@@ -9,6 +9,7 @@ import {property} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
 
 import {ripple} from '../../../ripple/directive.js';
+import {ARIAMixinStrict} from '../../../types/aria.js';
 import {ListItemEl} from '../listitem/list-item.js';
 
 type LinkTarget = '_blank'|'_parent'|'_self'|'_top';
@@ -29,8 +30,8 @@ export class ListItemLink extends ListItemEl {
       <a
           tabindex=${this.disabled ? -1 : this.itemTabIndex}
           role=${this.listItemRole}
-          aria-selected=${this.ariaSelected || nothing}
-          aria-checked=${this.ariaChecked || nothing}
+          aria-selected=${(this as ARIAMixinStrict).ariaSelected || nothing}
+          aria-checked=${(this as ARIAMixinStrict).ariaChecked || nothing}
           class="list-item ${classMap(this.getRenderClasses())}"
           href=${this.href}
           target=${this.target as LinkTarget || nothing}
diff --git a/menu/lib/menu.ts b/menu/lib/menu.ts
index 77f1c52657..c0ddef5755 100644
--- a/menu/lib/menu.ts
+++ b/menu/lib/menu.ts
@@ -4,23 +4,21 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// Required for @ariaProperty
-// tslint:disable:no-new-decorators
 import '../../list/list.js';
 import '../../focus/focus-ring.js';
 import '../../elevation/elevation.js';
 
-import {html, isServer, LitElement} from 'lit';
+import {html, isServer, LitElement, nothing} from 'lit';
 import {eventOptions, property, query, state} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
 import {styleMap} from 'lit/directives/style-map.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {MdFocusRing} from '../../focus/focus-ring.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {List} from '../../list/lib/list.js';
 import {createAnimationSignal, EASING} from '../../motion/animation.js';
-import {ARIARole} from '../../types/aria.js';
+import {ARIAMixinStrict, ARIARole} from '../../types/aria.js';
 
 import {ActivateTypeaheadEvent, DeactivateTypeaheadEvent, isElementInSubtree, MenuItem} from './shared.js';
 import {Corner, SurfacePositionController, SurfacePositionTarget} from './surfacePositionController.js';
@@ -67,15 +65,15 @@ function getFocusedElement(activeDoc: Document|ShadowRoot = document):
  * @fires closed Fired once the menu is closed, after any animations
  */
 export abstract class Menu extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   @query('md-list') protected readonly listElement!: List|null;
   @query('.menu') protected readonly surfaceEl!: HTMLElement|null;
   @query('slot') protected readonly slotEl!: HTMLSlotElement|null;
   @query('md-focus-ring') protected readonly focusRing!: MdFocusRing;
 
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   /**
    * The element in which the menu should align to.
    */
@@ -265,9 +263,11 @@ export abstract class Menu extends LitElement {
    * Renders the List element and its items
    */
   protected renderList() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <md-list
-          .ariaLabel=${this.ariaLabel}
+          aria-label=${ariaLabel || nothing}
           type=${this.type}
           listTabIndex=${this.listTabIndex}
           @focus=${this.handleListFocus}
diff --git a/navigationbar/lib/navigation-bar.ts b/navigationbar/lib/navigation-bar.ts
index bf5d1d06ae..38bd0e74dd 100644
--- a/navigationbar/lib/navigation-bar.ts
+++ b/navigationbar/lib/navigation-bar.ts
@@ -6,13 +6,13 @@
 
 import '../../elevation/elevation.js';
 
-import {html, LitElement, PropertyValues} from 'lit';
+import {html, LitElement, nothing, PropertyValues} from 'lit';
 import {property, queryAssignedElements} from 'lit/decorators.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {isRtl} from '../../controller/is-rtl.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {NavigationTab} from '../../navigationtab/lib/navigation-tab.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 import {NavigationTabInteractionEvent} from './constants.js';
 import {NavigationBarState} from './state.js';
@@ -21,6 +21,10 @@ import {NavigationBarState} from './state.js';
  * TODO(b/265346501): add docs
  */
 export class NavigationBar extends LitElement implements NavigationBarState {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   @property({type: Number}) activeIndex = 0;
 
   @property({type: Boolean}) hideInactiveLabels = false;
@@ -30,15 +34,12 @@ export class NavigationBar extends LitElement implements NavigationBarState {
   @queryAssignedElements({flatten: true})
   protected tabsElement!: NavigationTab[];
 
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   override render() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`<div class="md3-navigation-bar"
             role="tablist"
-            aria-label="${ifDefined(this.ariaLabel || undefined)}"
+            aria-label=${ariaLabel || nothing}
             @keydown="${this.handleKeydown}"
             @navigation-tab-interaction="${this.handleNavigationTabInteraction}"
             @navigation-tab-rendered=${this.handleNavigationTabConnected}
diff --git a/navigationdrawer/lib/navigation-drawer-modal.ts b/navigationdrawer/lib/navigation-drawer-modal.ts
index 9bbf47b6bd..ab243221f8 100644
--- a/navigationdrawer/lib/navigation-drawer-modal.ts
+++ b/navigationdrawer/lib/navigation-drawer-modal.ts
@@ -4,58 +4,39 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {html, LitElement, PropertyValues} from 'lit';
+import {html, LitElement, nothing, PropertyValues} from 'lit';
 import {property} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * TODO(b/265346501): add docs
  */
 export class NavigationDrawerModal extends LitElement {
-  /* aria properties */
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-describedby', noAccessor: true})
-  ariaDescribedBy: string|undefined;
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-modal', noAccessor: true})
-  override ariaModal: 'true'|'false' = 'false';
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-labelledby', noAccessor: true})
-  ariaLabelledBy: string|undefined;
+  static {
+    requestUpdateOnAriaChange(this);
+  }
 
-  @property({type: Boolean})  // tslint:disable-next-line:no-new-decorators
-  opened = false;
+  @property({type: Boolean}) opened = false;
   @property() pivot: 'start'|'end' = 'end';
 
   override render() {
     const ariaExpanded = this.opened ? 'true' : 'false';
     const ariaHidden = !this.opened ? 'true' : 'false';
-
+    // Needed for closure conformance
+    const {ariaLabel, ariaModal} = this as ARIAMixinStrict;
     return html`
       <div
         class="md3-navigation-drawer-modal__scrim ${this.getScrimClasses()}"
         @click="${this.handleScrimClick}">
       </div>
       <div
-        aria-describedby="${ifDefined(this.ariaDescribedBy)}"
-        aria-expanded="${ariaExpanded}"
-        aria-hidden="${ariaHidden}"
-        aria-label="${ifDefined(this.ariaLabel)}"
-        aria-labelledby="${ifDefined(this.ariaLabelledBy)}"
-        aria-modal="${this.ariaModal}"
+        aria-expanded=${ariaExpanded}
+        aria-hidden=${ariaHidden}
+        aria-label=${ariaLabel || nothing}
+        aria-modal=${ariaModal || nothing}
         class="md3-navigation-drawer-modal ${this.getRenderClasses()}"
         @keydown="${this.handleKeyDown}"
         role="dialog"><div class="md3-elevation-overlay"
diff --git a/navigationdrawer/lib/navigation-drawer.ts b/navigationdrawer/lib/navigation-drawer.ts
index 8aa97e30d8..dfac244258 100644
--- a/navigationdrawer/lib/navigation-drawer.ts
+++ b/navigationdrawer/lib/navigation-drawer.ts
@@ -6,54 +6,35 @@
 
 import '../../elevation/elevation.js';
 
-import {html, LitElement, PropertyValues} from 'lit';
+import {html, LitElement, nothing, PropertyValues} from 'lit';
 import {property} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * TODO(b/265346501): add docs
  */
 export class NavigationDrawer extends LitElement {
-  /* aria properties */
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-describedby', noAccessor: true})
-  ariaDescribedBy: string|undefined;
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-modal', noAccessor: true})
-  override ariaModal: 'true'|'false' = 'false';
-
-  // tslint:disable-next-line:no-new-decorators
-  @ariaProperty
-  @property({attribute: 'data-aria-labelledby', noAccessor: true})
-  ariaLabelledBy: string|undefined;
+  static {
+    requestUpdateOnAriaChange(this);
+  }
 
-  @property({type: Boolean})  // tslint:disable-next-line:no-new-decorators
-  opened = false;
+  @property({type: Boolean}) opened = false;
   @property() pivot: 'start'|'end' = 'end';
 
   override render() {
     const ariaExpanded = this.opened ? 'true' : 'false';
     const ariaHidden = !this.opened ? 'true' : 'false';
-
+    // Needed for closure conformance
+    const {ariaLabel, ariaModal} = this as ARIAMixinStrict;
     return html`
       <div
-        aria-describedby="${ifDefined(this.ariaDescribedBy)}"
         aria-expanded="${ariaExpanded}"
         aria-hidden="${ariaHidden}"
-        aria-label="${ifDefined(this.ariaLabel)}"
-        aria-labelledby="${ifDefined(this.ariaLabelledBy)}"
-        aria-modal="${this.ariaModal}"
+        aria-label=${ariaLabel || nothing}
+        aria-modal="${ariaModal || nothing}"
         class="md3-navigation-drawer ${this.getRenderClasses()}"
         role="dialog">
         <md-elevation></md-elevation>
diff --git a/navigationtab/lib/navigation-tab.ts b/navigationtab/lib/navigation-tab.ts
index 75f39d3d6b..3d4fd153f9 100644
--- a/navigationtab/lib/navigation-tab.ts
+++ b/navigationtab/lib/navigation-tab.ts
@@ -11,13 +11,13 @@ import '../../ripple/ripple.js';
 import {html, LitElement, nothing, PropertyValues} from 'lit';
 import {property, query, queryAsync, state} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 import {when} from 'lit/directives/when.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 import {NavigationTabState} from './state.js';
 
@@ -25,6 +25,10 @@ import {NavigationTabState} from './state.js';
  * TODO(b/265346501): add docs
  */
 export class NavigationTab extends LitElement implements NavigationTabState {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   @property({type: Boolean}) disabled = false;
   @property({type: Boolean, reflect: true}) active = false;
   @property({type: Boolean}) hideInactiveLabel = false;
@@ -35,21 +39,19 @@ export class NavigationTab extends LitElement implements NavigationTabState {
   @state() protected showFocusRing = false;
   @state() protected showRipple = false;
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   @query('button') buttonElement!: HTMLElement;
 
   @queryAsync('md-ripple') ripple!: Promise<MdRipple|null>;
 
   override render() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <button
         class="md3-navigation-tab ${classMap(this.getRenderClasses())}"
         role="tab"
         aria-selected="${this.active}"
-        aria-label="${ifDefined(this.ariaLabel)}"
+        aria-label=${ariaLabel || nothing}
         tabindex="${this.active ? 0 : -1}"
         @focus="${this.handleFocus}"
         @blur="${this.handleBlur}"
@@ -98,7 +100,9 @@ export class NavigationTab extends LitElement implements NavigationTabState {
   }
 
   protected renderLabel() {
-    const ariaHidden = this.ariaLabel ? 'true' : 'false';
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
+    const ariaHidden = ariaLabel ? 'true' : 'false';
     return !this.label ?
         nothing :
         html`
diff --git a/radio/lib/radio.ts b/radio/lib/radio.ts
index ecef4529c6..abe6f04dc2 100644
--- a/radio/lib/radio.ts
+++ b/radio/lib/radio.ts
@@ -11,12 +11,13 @@ import {html, isServer, LitElement, nothing, TemplateResult} from 'lit';
 import {property, query, queryAsync, state} from 'lit/decorators.js';
 import {when} from 'lit/directives/when.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';
 import {FormController, getFormValue} from '../../controller/form-controller.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 import {SingleSelectionController} from './single-selection-controller.js';
 
@@ -26,6 +27,10 @@ const CHECKED = Symbol('checked');
  * A radio component.
  */
 export class Radio extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions:
       ShadowRootInit = {...LitElement.shadowRootOptions, delegatesFocus: true};
 
@@ -69,10 +74,6 @@ export class Radio extends LitElement {
    */
   @property({reflect: true}) name = '';
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   /**
    * The associated form element with which this element's value will submit.
    */
@@ -110,6 +111,8 @@ export class Radio extends LitElement {
   }
 
   protected override render(): TemplateResult {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       ${when(this.showRipple, this.renderRipple)}
       ${this.renderFocusRing()}
@@ -124,7 +127,7 @@ export class Radio extends LitElement {
       <input
         type="radio"
         name=${this.name}
-        aria-label=${this.ariaLabel || nothing}
+        aria-label=${ariaLabel || nothing}
         .checked=${this.checked}
         .value=${this.value}
         ?disabled=${this.disabled}
diff --git a/segmentedbutton/lib/segmented-button.ts b/segmentedbutton/lib/segmented-button.ts
index e361bf4027..95fc611ee7 100644
--- a/segmentedbutton/lib/segmented-button.ts
+++ b/segmentedbutton/lib/segmented-button.ts
@@ -7,16 +7,16 @@
 import '../../focus/focus-ring.js';
 import '../../ripple/ripple.js';
 
-import {html, LitElement, PropertyValues} from 'lit';
+import {html, LitElement, nothing, PropertyValues} from 'lit';
 import {property, queryAssignedElements, queryAsync, state} from 'lit/decorators.js';
 import {classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 import {when} from 'lit/directives/when.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * SegmentedButton is a web component implementation of the Material Design
@@ -25,16 +25,16 @@ import {MdRipple} from '../../ripple/ripple.js';
  * context.
  */
 export class SegmentedButton extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   @property({type: Boolean}) disabled = false;
   @property({type: Boolean}) selected = false;
   @property() label = '';
   @property({type: Boolean}) noCheckmark = false;
   @property({type: Boolean}) hasIcon = false;
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'aria-label'})
-  override ariaLabel!: string;
-
   @state() protected animState = '';
   @state() protected showFocusRing = false;
   @state() protected showRipple = false;
@@ -87,10 +87,12 @@ export class SegmentedButton extends LitElement {
   }
 
   override render() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
       <button
         tabindex="${this.disabled ? '-1' : '0'}"
-        aria-label="${ifDefined(this.ariaLabel)}"
+        aria-label=${ariaLabel || nothing}
         aria-pressed=${this.selected}
         ?disabled=${this.disabled}
         @focus="${this.handleFocus}"
diff --git a/segmentedbuttonset/lib/segmented-button-set.ts b/segmentedbuttonset/lib/segmented-button-set.ts
index e1c5d848a7..54f6348090 100644
--- a/segmentedbuttonset/lib/segmented-button-set.ts
+++ b/segmentedbuttonset/lib/segmented-button-set.ts
@@ -4,12 +4,12 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import {html, LitElement} from 'lit';
+import {html, LitElement, nothing} from 'lit';
 import {property, queryAssignedElements} from 'lit/decorators.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 
-import {ariaProperty} from '../../decorators/aria-property.js';
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {SegmentedButton} from '../../segmentedbutton/lib/segmented-button.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * SegmentedButtonSet is the parent component for two or more
@@ -17,11 +17,11 @@ import {SegmentedButton} from '../../segmentedbutton/lib/segmented-button.js';
  * used as children.
  */
 export class SegmentedButtonSet extends LitElement {
-  @property({type: Boolean}) multiselect = false;
+  static {
+    requestUpdateOnAriaChange(this);
+  }
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'aria-label'})
-  override ariaLabel!: string;
+  @property({type: Boolean}) multiselect = false;
 
   @queryAssignedElements({flatten: true}) buttons!: SegmentedButton[];
 
@@ -91,11 +91,13 @@ export class SegmentedButtonSet extends LitElement {
   }
 
   override render() {
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`
      <span
        role="group"
        @segmented-button-interaction="${this.handleSegmentedButtonInteraction}"
-       aria-label="${ifDefined(this.ariaLabel)}"
+       aria-label=${ariaLabel || nothing}
        class="md3-segmented-button-set">
        <slot></slot>
      </span>
diff --git a/slider/lib/slider.ts b/slider/lib/slider.ts
index 0fb97dd794..94db106fcc 100644
--- a/slider/lib/slider.ts
+++ b/slider/lib/slider.ts
@@ -14,19 +14,16 @@ import {classMap} from 'lit/directives/class-map.js';
 import {styleMap} from 'lit/directives/style-map.js';
 import {when} from 'lit/directives/when.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {dispatchActivationClick, isActivationClick, redispatchEvent} from '../../controller/events.js';
 import {FormController, getFormValue} from '../../controller/form-controller.js';
 import {stringConverter} from '../../controller/string-converter.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {pointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 
-
-// This is required for decorators.
-// tslint:disable:no-new-decorators
-
 // Disable warning for classMap with destructuring
 // tslint:disable:quoted-properties-on-dictionary
 
@@ -77,6 +74,10 @@ function isOverlapping(elA: Element, elB: Element) {
  * Slider component.
  */
 export class Slider extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions:
       ShadowRootInit = {...LitElement.shadowRootOptions, delegatesFocus: true};
 
@@ -85,10 +86,6 @@ export class Slider extends LitElement {
    */
   static formAssociated = true;
 
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
   /**
    * Whether or not the slider is disabled.
    */
@@ -408,6 +405,8 @@ export class Slider extends LitElement {
     // when ranged, ensure announcement includes value info.
     const ariaLabelDescriptor =
         this.allowRange ? ` - ${lesser ? `start` : `end`} handle` : '';
+    // Needed for closure conformance
+    const {ariaLabel} = this as ARIAMixinStrict;
     return html`<input type="range"
       class="${classMap({
       lesser,
@@ -427,7 +426,7 @@ export class Slider extends LitElement {
       .step=${String(this.step)}
       .value=${String(value)}
       .tabIndex=${lesser ? 1 : 0}
-      aria-label=${`${this.ariaLabel}${ariaLabelDescriptor}` || nothing}
+      aria-label=${`${ariaLabel}${ariaLabelDescriptor}` || nothing}
       aria-valuetext=${label}
       ${ripple(getRipple)}>`;
   }
diff --git a/switch/lib/switch.ts b/switch/lib/switch.ts
index cf234c7ca9..f15256c40f 100644
--- a/switch/lib/switch.ts
+++ b/switch/lib/switch.ts
@@ -4,20 +4,17 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-// tslint:disable:no-new-decorators
-
 import '../../focus/focus-ring.js';
 import '../../ripple/ripple.js';
 
-import {html, isServer, LitElement, TemplateResult} from 'lit';
+import {html, isServer, LitElement, nothing, TemplateResult} from 'lit';
 import {eventOptions, property, query, queryAsync, state} from 'lit/decorators.js';
 import {ClassInfo, classMap} from 'lit/directives/class-map.js';
-import {ifDefined} from 'lit/directives/if-defined.js';
 import {when} from 'lit/directives/when.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {dispatchActivationClick, isActivationClick} from '../../controller/events.js';
 import {FormController, getFormValue} from '../../controller/form-controller.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
 import {pointerPress as focusRingPointerPress, shouldShowStrongFocus} from '../../focus/strong-focus.js';
 import {ripple} from '../../ripple/directive.js';
 import {MdRipple} from '../../ripple/ripple.js';
@@ -29,6 +26,10 @@ import {MdRipple} from '../../ripple/ripple.js';
  * interaction (bubbles).
  */
 export class Switch extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions:
       ShadowRootInit = {mode: 'open', delegatesFocus: true};
 
@@ -59,14 +60,6 @@ export class Switch extends LitElement {
    */
   @property({type: Boolean}) showOnlySelectedIcon = false;
 
-  @ariaProperty
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  override ariaLabel!: string;
-
-  @ariaProperty
-  @property({attribute: 'data-aria-labelledby', noAccessor: true})
-  ariaLabelledBy = '';
-
   @state() private showFocusRing = false;
   @state() private showRipple = false;
 
@@ -116,9 +109,6 @@ export class Switch extends LitElement {
   }
 
   protected override render(): TemplateResult {
-    const ariaLabelValue = this.ariaLabel ? this.ariaLabel : undefined;
-    const ariaLabelledByValue =
-        this.ariaLabelledBy ? this.ariaLabelledBy : undefined;
     // NOTE: buttons must use only [phrasing
     // content](https://html.spec.whatwg.org/multipage/dom.html#phrasing-content)
     // children, which includes custom elements, but not `div`s
@@ -128,8 +118,7 @@ export class Switch extends LitElement {
         class="md3-switch ${classMap(this.getRenderClasses())}"
         role="switch"
         aria-checked="${this.selected}"
-        aria-label="${ifDefined(ariaLabelValue)}"
-        aria-labelledby="${ifDefined(ariaLabelledByValue)}"
+        aria-label=${(this as ARIAMixin).ariaLabel || nothing}
         ?disabled=${this.disabled}
         @click=${this.handleClick}
         @focus="${this.handleFocus}"
diff --git a/switch/lib/switch_test.ts b/switch/lib/switch_test.ts
index e5800e5ba8..c3dfe94868 100644
--- a/switch/lib/switch_test.ts
+++ b/switch/lib/switch_test.ts
@@ -126,16 +126,12 @@ describe('md-switch', () => {
   });
 
   describe('aria', () => {
-    it('is an empty string by default', () => {
-      expect(toggle.ariaLabel).toEqual('');
-    });
-
     it('delegates aria-label to the proper element', async () => {
       const button = toggle.shadowRoot!.querySelector('button')!;
       toggle.setAttribute('aria-label', 'foo');
       await toggle.updateComplete;
       expect(toggle.ariaLabel).toEqual('foo');
-      expect(toggle.getAttribute('aria-label')).toEqual(null);
+      expect(toggle.getAttribute('aria-label')).toEqual('foo');
       expect(button.getAttribute('aria-label')).toEqual('foo');
     });
 
@@ -144,27 +140,9 @@ describe('md-switch', () => {
       toggle.ariaLabel = 'foo';
       await toggle.updateComplete;
       expect(toggle.ariaLabel).toEqual('foo');
-      expect(toggle.getAttribute('aria-label')).toEqual(null);
+      expect(toggle.getAttribute('aria-label')).toEqual('foo');
       expect(button.getAttribute('aria-label')).toEqual('foo');
     });
-
-    it('delegates aria-labelledby to the proper element', async () => {
-      const button = toggle.shadowRoot!.querySelector('button')!;
-      toggle.setAttribute('aria-labelledby', 'foo');
-      await toggle.updateComplete;
-      expect(toggle.ariaLabelledBy).toEqual('foo');
-      expect(toggle.getAttribute('aria-labelledby')).toEqual(null);
-      expect(button.getAttribute('aria-labelledby')).toEqual('foo');
-    });
-
-    it('delegates .ariaLabelledBy to the proper element', async () => {
-      const button = toggle.shadowRoot!.querySelector('button')!;
-      toggle.ariaLabelledBy = 'foo';
-      await toggle.updateComplete;
-      expect(toggle.ariaLabelledBy).toEqual('foo');
-      expect(toggle.getAttribute('aria-labelledby')).toEqual(null);
-      expect(button.getAttribute('aria-labelledby')).toEqual('foo');
-    });
   });
 
   describe('name', () => {
diff --git a/textfield/lib/text-field.ts b/textfield/lib/text-field.ts
index af8a2f9955..f00c2d8ac1 100644
--- a/textfield/lib/text-field.ts
+++ b/textfield/lib/text-field.ts
@@ -11,11 +11,11 @@ import {live} from 'lit/directives/live.js';
 import {styleMap} from 'lit/directives/style-map.js';
 import {html as staticHtml, StaticValue} from 'lit/static-html.js';
 
+import {requestUpdateOnAriaChange} from '../../aria/delegate.js';
 import {redispatchEvent} from '../../controller/events.js';
 import {FormController, getFormValue} from '../../controller/form-controller.js';
 import {stringConverter} from '../../controller/string-converter.js';
-import {ariaProperty} from '../../decorators/aria-property.js';
-import {ARIAAutoComplete, ARIAExpanded} from '../../types/aria.js';
+import {ARIAMixinStrict} from '../../types/aria.js';
 
 /**
  * Input types that are compatible with the text field.
@@ -39,6 +39,10 @@ export type InvalidTextFieldType =
  * A text field component.
  */
 export abstract class TextField extends LitElement {
+  static {
+    requestUpdateOnAriaChange(this);
+  }
+
   static override shadowRootOptions:
       ShadowRootInit = {...LitElement.shadowRootOptions, delegatesFocus: true};
 
@@ -101,30 +105,6 @@ export abstract class TextField extends LitElement {
    */
   @property() textDirection = '';
 
-  // ARIA
-  @property({attribute: 'data-aria-autocomplete', noAccessor: true})
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  override ariaAutoComplete: ARIAAutoComplete|null = null;
-
-  @property({attribute: 'data-aria-controls', noAccessor: true})
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  ariaControls: string|null = null;
-
-  @property({attribute: 'data-aria-activedescendant', noAccessor: true})
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  ariaActiveDescendant: string|null = null;
-
-  @property({attribute: 'data-aria-expanded', noAccessor: true})
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  override ariaExpanded: ARIAExpanded|null = null;
-
-  /**
-   * The `aria-label` of the text field's input.
-   */
-  @property({attribute: 'data-aria-label', noAccessor: true})
-  @ariaProperty  // tslint:disable-line:no-new-decorators
-  override ariaLabel!: string;
-
   // FormElement
   get form() {
     return this.closest('form');
@@ -590,13 +570,13 @@ export abstract class TextField extends LitElement {
     // fixed
     return html`<input
        style=${styleMap(style)}
-       aria-activedescendant=${this.ariaActiveDescendant || nothing}
-       aria-autocomplete=${this.ariaAutoComplete || nothing}
-       aria-controls=${this.ariaControls || nothing}
+       aria-autocomplete=${
+        (this as ARIAMixinStrict).ariaAutoComplete || nothing}
        aria-describedby=${this.getAriaDescribedBy() || nothing}
-       aria-expanded=${this.ariaExpanded || nothing}
+       aria-expanded=${(this as ARIAMixinStrict).ariaExpanded || nothing}
        aria-invalid=${this.hasError}
-       aria-label=${this.ariaLabel || this.label || nothing}
+       aria-label=${
+        (this as ARIAMixinStrict).ariaLabel || this.label || nothing}
        ?disabled=${this.disabled}
        max=${(this.max || nothing) as unknown as number}
        maxlength=${this.maxLength > -1 ? this.maxLength : nothing}