diff --git a/addons/rose/addon/components/rose/dropdown.js b/addons/rose/addon/components/rose/dropdown.js
index 33547b719..8ae6f56e6 100644
--- a/addons/rose/addon/components/rose/dropdown.js
+++ b/addons/rose/addon/components/rose/dropdown.js
@@ -2,6 +2,9 @@ import Component from '@ember/component';
 import layout from '../../templates/components/rose/dropdown';
 import { action } from '@ember/object';
 
+/**
+ * A dropdown component composed of HTML disclosure elements: details and summary
+ */
 export default Component.extend({
   // =attributes
 
diff --git a/addons/rose/addon/components/rose/dropdown.stories.mdx b/addons/rose/addon/components/rose/dropdown.stories.mdx
index e77c8a73d..999b6278f 100644
--- a/addons/rose/addon/components/rose/dropdown.stories.mdx
+++ b/addons/rose/addon/components/rose/dropdown.stories.mdx
@@ -43,7 +43,7 @@ A simple dropdown component with support for links and buttons.
 Dropdown content can be aligned to right edge of the component instead of the default left edge, which is the default setting. The following example floats the component to right edge of the page inorder to provide enough space to display right aligned dropdown content.
 
 ```htmlbars
-  <Rose::Dropdown @text="Choose One&hellip;" style="float: right" @alignRight={{true}} as |dropdown|>
+  <Rose::Dropdown @text="Choose One&hellip;" style="float: right" @dropdownRight={{true}} as |dropdown|>
     <dropdown.link @route="index">Menu item</dropdown.link>
     <dropdown.link @route="about">Menu item</dropdown.link>
     <dropdown.button>Button menu item</dropdown.button>
diff --git a/addons/rose/addon/templates/components/rose/dropdown.hbs b/addons/rose/addon/templates/components/rose/dropdown.hbs
index 9386431d2..6556bd0bc 100644
--- a/addons/rose/addon/templates/components/rose/dropdown.hbs
+++ b/addons/rose/addon/templates/components/rose/dropdown.hbs
@@ -1,6 +1,6 @@
 <details
   ...attributes
-  class="rose-dropdown {{if @alignRight " rose-dropdown-right"}}"
+  class="rose-dropdown {{if @dropdownRight " rose-dropdown-right"}}"
   {{on-click-outside this.close}}
 >
 
diff --git a/addons/rose/addon/templates/components/rose/header/nav.hbs b/addons/rose/addon/templates/components/rose/header/nav.hbs
index 18458e10c..a0858cc1a 100644
--- a/addons/rose/addon/templates/components/rose/header/nav.hbs
+++ b/addons/rose/addon/templates/components/rose/header/nav.hbs
@@ -1,6 +1,6 @@
 <nav class="rose-header-nav">
   {{yield (hash
     link=(component 'link-to' class="rose-header-nav-link")
-    dropdown=(component 'rose/dropdown' style="light")
+    dropdown=(component 'rose/dropdown')
   )}}
 </nav>
diff --git a/addons/rose/addon/templates/components/rose/header/utilities.hbs b/addons/rose/addon/templates/components/rose/header/utilities.hbs
index 8c178538c..e00d45e75 100644
--- a/addons/rose/addon/templates/components/rose/header/utilities.hbs
+++ b/addons/rose/addon/templates/components/rose/header/utilities.hbs
@@ -1,5 +1,5 @@
 <div class="rose-header-utilities">
   {{yield (hash
-    dropdown=(component 'rose/dropdown' alignRight=true)
+    dropdown=(component 'rose/dropdown' dropdownRight=true)
   )}}
 </div>
diff --git a/addons/rose/tests/integration/components/rose/dropdown-test.js b/addons/rose/tests/integration/components/rose/dropdown-test.js
index 03c1b65e7..0c0c22695 100644
--- a/addons/rose/tests/integration/components/rose/dropdown-test.js
+++ b/addons/rose/tests/integration/components/rose/dropdown-test.js
@@ -35,7 +35,7 @@ module('Integration | Component | rose/dropdown', function (hooks) {
 
   test('it supports right aligned content', async function (assert) {
     await render(hbs`
-      <Rose::Dropdown @alignRight={{true}} />
+      <Rose::Dropdown @dropdownRight={{true}} />
     `);
     assert.ok(find('.rose-dropdown-right'));
   });