diff --git a/addons/rose/addon/components/rose/dialog/index.hbs b/addons/rose/addon/components/rose/dialog/index.hbs index e5ab02b7b..aa03d38de 100644 --- a/addons/rose/addon/components/rose/dialog/index.hbs +++ b/addons/rose/addon/components/rose/dialog/index.hbs @@ -5,10 +5,15 @@ ...attributes role="dialog" class="rose-dialog {{if @style (concat "rose-dialog-" @style)}} {{if @modal 'modal'}}" + id={{this.id}} + aria-describedby={{concat "dialog-header-" this.id}} {{focus-trap}} > -
+
{{#if @icon}} diff --git a/addons/rose/addon/components/rose/dialog/index.js b/addons/rose/addon/components/rose/dialog/index.js index 241ed5ba7..e152fcaf0 100644 --- a/addons/rose/addon/components/rose/dialog/index.js +++ b/addons/rose/addon/components/rose/dialog/index.js @@ -1,8 +1,16 @@ import Component from '@glimmer/component'; +import { generateComponentID } from '../../../utilities/component-auto-id'; import { action } from '@ember/object'; export default class RoseDialogComponent extends Component { + // =attributes + + /** + * @type {string} + */ + id = generateComponentID(); + // =methods /**