From 5f6627d5c6d03ec8679db9e4b7177d535a4cc1a7 Mon Sep 17 00:00:00 2001 From: Andrew Seguin Date: Wed, 12 Nov 2025 15:27:08 -0700 Subject: [PATCH] refactor(multiple): remove aria classes # Conflicts: # src/aria/accordion/accordion.ts --- src/aria/accordion/accordion.ts | 3 --- src/aria/listbox/listbox.ts | 2 -- src/aria/menu/menu.ts | 4 ---- src/aria/tabs/tabs.ts | 6 ------ src/aria/toolbar/toolbar.ts | 7 +------ src/aria/tree/tree.ts | 2 -- 6 files changed, 1 insertion(+), 23 deletions(-) diff --git a/src/aria/accordion/accordion.ts b/src/aria/accordion/accordion.ts index 3249e05bee9d..db99a2322116 100644 --- a/src/aria/accordion/accordion.ts +++ b/src/aria/accordion/accordion.ts @@ -59,7 +59,6 @@ import { }, ], host: { - 'class': 'ng-accordion-panel', 'role': 'region', '[attr.id]': '_pattern.id()', '[attr.aria-labelledby]': '_pattern.accordionTrigger()?.id()', @@ -134,7 +133,6 @@ export class AccordionPanel { selector: '[ngAccordionTrigger]', exportAs: 'ngAccordionTrigger', host: { - 'class': 'ng-accordion-trigger', '[attr.data-active]': 'active()', 'role': 'button', '[id]': '_pattern.id()', @@ -235,7 +233,6 @@ export class AccordionTrigger { selector: '[ngAccordionGroup]', exportAs: 'ngAccordionGroup', host: { - 'class': 'ng-accordion-group', '(keydown)': '_pattern.onKeydown($event)', '(pointerdown)': '_pattern.onPointerdown($event)', '(focusin)': '_pattern.onFocus($event)', diff --git a/src/aria/listbox/listbox.ts b/src/aria/listbox/listbox.ts index 01c70723569f..6fed41b4c1c1 100644 --- a/src/aria/listbox/listbox.ts +++ b/src/aria/listbox/listbox.ts @@ -49,7 +49,6 @@ import {ComboboxPopup} from '../combobox'; exportAs: 'ngListbox', host: { 'role': 'listbox', - 'class': 'ng-listbox', '[attr.id]': 'id()', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.aria-readonly]': '_pattern.readonly()', @@ -230,7 +229,6 @@ export class Listbox { exportAs: 'ngOption', host: { 'role': 'option', - 'class': 'ng-option', '[attr.data-active]': '_pattern.active()', '[attr.id]': '_pattern.id()', '[attr.tabindex]': '_pattern.tabIndex()', diff --git a/src/aria/menu/menu.ts b/src/aria/menu/menu.ts index e5e78c79f14b..387f0a69f904 100644 --- a/src/aria/menu/menu.ts +++ b/src/aria/menu/menu.ts @@ -56,7 +56,6 @@ import {Directionality} from '@angular/cdk/bidi'; selector: 'button[ngMenuTrigger]', exportAs: 'ngMenuTrigger', host: { - 'class': 'ng-menu-trigger', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.disabled]': '!softDisabled() && _pattern.disabled() ? true : null', '[attr.aria-disabled]': '_pattern.disabled()', @@ -146,7 +145,6 @@ export class MenuTrigger { exportAs: 'ngMenu', host: { 'role': 'menu', - 'class': 'ng-menu', '[attr.id]': '_pattern.id()', '[attr.aria-disabled]': '_pattern.disabled()', '[attr.tabindex]': 'tabIndex()', @@ -305,7 +303,6 @@ export class Menu { exportAs: 'ngMenuBar', host: { 'role': 'menubar', - 'class': 'ng-menu-bar', '[attr.disabled]': '!softDisabled() && _pattern.disabled() ? true : null', '[attr.aria-disabled]': '_pattern.disabled()', '[attr.tabindex]': '_pattern.tabIndex()', @@ -405,7 +402,6 @@ export class MenuBar { exportAs: 'ngMenuItem', host: { 'role': 'menuitem', - 'class': 'ng-menu-item', '(focusin)': '_pattern.onFocusIn()', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.data-active]': 'isActive()', diff --git a/src/aria/tabs/tabs.ts b/src/aria/tabs/tabs.ts index cc2808873175..1bd187f43975 100644 --- a/src/aria/tabs/tabs.ts +++ b/src/aria/tabs/tabs.ts @@ -75,9 +75,6 @@ function sortDirectives(a: HasElement, b: HasElement) { @Directive({ selector: '[ngTabs]', exportAs: 'ngTabs', - host: { - 'class': 'ng-tabs', - }, }) export class Tabs { /** The TabList nested inside of the container. */ @@ -138,7 +135,6 @@ export class Tabs { exportAs: 'ngTabList', host: { 'role': 'tablist', - 'class': 'ng-tablist', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.aria-disabled]': '_pattern.disabled()', '[attr.aria-orientation]': '_pattern.orientation()', @@ -278,7 +274,6 @@ export class TabList implements OnInit, OnDestroy { exportAs: 'ngTab', host: { 'role': 'tab', - 'class': 'ng-tab', '[attr.data-active]': 'active()', '[attr.id]': '_pattern.id()', '[attr.tabindex]': '_pattern.tabIndex()', @@ -367,7 +362,6 @@ export class Tab implements HasElement, OnInit, OnDestroy { exportAs: 'ngTabPanel', host: { 'role': 'tabpanel', - 'class': 'ng-tabpanel', '[attr.id]': '_pattern.id()', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.inert]': '!visible() ? true : null', diff --git a/src/aria/toolbar/toolbar.ts b/src/aria/toolbar/toolbar.ts index 600cc6281600..ab43545c7764 100644 --- a/src/aria/toolbar/toolbar.ts +++ b/src/aria/toolbar/toolbar.ts @@ -67,7 +67,6 @@ function sortDirectives(a: HasElement, b: HasElement) { exportAs: 'ngToolbar', host: { 'role': 'toolbar', - 'class': 'ng-toolbar', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.aria-disabled]': '_pattern.disabled()', '[attr.aria-orientation]': '_pattern.orientation()', @@ -157,7 +156,7 @@ export class Toolbar { /** Finds the toolbar item associated with a given element. */ private _getItem(element: Element) { - const widgetTarget = element.closest('.ng-toolbar-widget'); + const widgetTarget = element.closest('[ngToolbarWidget]'); return this.items().find(widget => widget.element() === widgetTarget); } } @@ -181,7 +180,6 @@ export class Toolbar { selector: '[ngToolbarWidget]', exportAs: 'ngToolbarWidget', host: { - 'class': 'ng-toolbar-widget', '[attr.data-active]': 'active()', '[attr.tabindex]': '_pattern.tabIndex()', '[attr.inert]': 'hardDisabled() ? true : null', @@ -256,9 +254,6 @@ export class ToolbarWidget implements OnInit, OnDestroy { @Directive({ selector: '[ngToolbarWidgetGroup]', exportAs: 'ngToolbarWidgetGroup', - host: { - '[class.ng-toolbar-widget-group]': '!!toolbar()', - }, }) export class ToolbarWidgetGroup { /** The parent Toolbar. */ diff --git a/src/aria/tree/tree.ts b/src/aria/tree/tree.ts index 3079a6c254d2..991585970f78 100644 --- a/src/aria/tree/tree.ts +++ b/src/aria/tree/tree.ts @@ -84,7 +84,6 @@ function sortDirectives(a: HasElement, b: HasElement) { selector: '[ngTree]', exportAs: 'ngTree', host: { - 'class': 'ng-tree', 'role': 'tree', '[attr.id]': 'id()', '[attr.aria-orientation]': '_pattern.orientation()', @@ -256,7 +255,6 @@ export class Tree { selector: '[ngTreeItem]', exportAs: 'ngTreeItem', host: { - 'class': 'ng-treeitem', '[attr.data-active]': 'active()', 'role': 'treeitem', '[id]': '_pattern.id()',