diff --git a/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.html b/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.html
index caa014e61494..f24a48719b9b 100644
--- a/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.html
+++ b/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.html
@@ -27,7 +27,11 @@
aria-label="Select text alignment"
>
@for (alignment of alignments; track alignment) {
-
+
{{ alignment.label }}
diff --git a/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.ts b/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.ts
index 45af7aac691d..4ed91715998c 100644
--- a/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.ts
+++ b/src/components-examples/aria/toolbar/toolbar-basic-horizontal/toolbar-basic-horizontal-example.ts
@@ -17,10 +17,15 @@ export class ToolbarBasicHorizontalExample {
{value: 'center', label: 'Center'},
{value: 'right', label: 'Right'},
];
+
+ // Control for which radio options are individually disabled
+ disabledOptions: string[] = ['center'];
+
format(tool: string) {
console.log(`Tool activated: ${tool}`);
this._liveAnnouncer.announce(`${tool} applied`, 'polite');
}
+
test(action: string) {
console.log(`Action triggered: ${action}`);
this._liveAnnouncer.announce(`${action} button activated`, 'polite');
diff --git a/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.html b/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.html
index eec277e9de26..25c7ec93dbb6 100644
--- a/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.html
+++ b/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.html
@@ -27,7 +27,11 @@
aria-label="Select text alignment"
>
@for (alignment of alignments; track alignment) {
-
+
{{ alignment.label }}
diff --git a/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.ts b/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.ts
index fec7482882d1..6620cdf3cdb8 100644
--- a/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.ts
+++ b/src/components-examples/aria/toolbar/toolbar-basic-vertical/toolbar-basic-vertical-example.ts
@@ -17,10 +17,15 @@ export class ToolbarBasicVerticalExample {
{value: 'center', label: 'Center'},
{value: 'right', label: 'Right'},
];
+
+ // Control for which radio options are individually disabled
+ disabledOptions: string[] = ['center'];
+
format(tool: string) {
console.log(`Tool activated: ${tool}`);
this._liveAnnouncer.announce(`${tool} applied`, 'polite');
}
+
test(action: string) {
console.log(`Action triggered: ${action}`);
this._liveAnnouncer.announce(`${action} button activated`, 'polite');