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');