Merge branch 'develop' into chore-errors

addons/rose/addon/components/rose/nav/sidebar.js

@@ -1,5 +1,5 @@
 import Component from '@ember/component';
-import layout from '../../../templates/components/rose/nav/primary';
+import layout from '../../../templates/components/rose/nav/sidebar';
 import ComponentAutoId from '../../../mixins/component-auto-id';
 
 /**

addons/rose/addon/components/rose/nav/sidebar.stories.mdx

@@ -3,19 +3,19 @@ import { hbs } from 'ember-cli-htmlbars';
 import { action } from '@storybook/addon-actions';
 import { text, boolean, select } from '@storybook/addon-knobs';
 
-<Meta title="Rose|Nav/Primary" component="Nav/Primary" />
+<Meta title="Rose|Nav/Sidebar" component="Nav/Sidebar" />
 
-# Primary Navigation
+# Sidebar Navigation
 
 A simple navigation component intended for use in the sidebar layout region.
 
 <Preview>
-  <Story name="Basic Primary Nav" height="8rem">{{
+  <Story name="Basic Sidebar Nav" height="8rem">{{
     template: hbs`
-      <Rose::Nav::Primary @title={{title}} as |nav|>
+      <Rose::Nav::Sidebar @title={{title}} as |nav|>
         <nav.link @route="index" class="active">Item Name</nav.link>
         <nav.link @route="index">Item Name</nav.link>
-      </Rose::Nav::Primary>
+      </Rose::Nav::Sidebar>
     `,
     context: {
       title: text('title', 'Title'),
@@ -27,8 +27,8 @@ _Note_:  do not assign the `active` class directly.  This is done by the link
 component automatically.  We use it in this story for illustrative purposes.
 
 ```htmlbars
-<Rose::Nav::Primary @title="Title" as |nav|>
+<Rose::Nav::Sidebar @title="Title" as |nav|>
   <nav.link @route="index">Item Name</nav.link>
   <nav.link @route="about">Item Name</nav.link>
-</Rose::Nav::Primary>
+</Rose::Nav::Sidebar>
 ```

addons/rose/addon/styles/rose/components/nav/_index.scss

@@ -1 +1 @@
-@import "primary";
+@import "sidebar";

addons/rose/addon/styles/rose/components/nav/_sidebar.scss

@@ -1,7 +1,7 @@
 @use '../../variables/sizing';
 @use '../../utilities/type';
 
-.rose-nav-primary {
+.rose-nav-sidebar {
   $threePX: sizing.rems(xxxs) + sizing.rems(xxxxs);
 
   .rose-nav-title {

addons/rose/addon/templates/components/rose/nav/sidebar.hbs

@@ -1,6 +1,6 @@
 <nav
   ...attributes
-  class="rose-nav-primary"
+  class="rose-nav-sidebar"
   id={{this.id}}
   aria-labelledby={{if @title (concat "title-" this.id)}}>
 

addons/rose/app/components/rose/nav/primary.js

@@ -1 +0,0 @@
-export { default } from 'rose/components/rose/nav/primary';

addons/rose/app/components/rose/nav/sidebar.js

@@ -0,0 +1 @@
+export { default } from 'rose/components/rose/nav/sidebar';

addons/rose/tests/dummy/app/templates/index.hbs

@@ -31,12 +31,12 @@
   </page.header>
 
   <page.sidebar>
-    <Rose::Nav::Primary @title="Title" as |nav|>
+    <Rose::Nav::Sidebar @title="Title" as |nav|>
       <nav.link @route="index">Item Name</nav.link>
       <nav.link @route="about">Item Name</nav.link>
       <nav.link @route="about">Item Name</nav.link>
       <nav.link @route="about">Item Name</nav.link>
-    </Rose::Nav::Primary>
+    </Rose::Nav::Sidebar>
   </page.sidebar>
 
   <page.main>

addons/rose/tests/integration/components/rose/nav/sidebar-test.js

@@ -3,15 +3,15 @@ import { setupRenderingTest } from 'ember-qunit';
 import { render, find } from '@ember/test-helpers';
 import hbs from 'htmlbars-inline-precompile';
 
-module('Integration | Component | rose/nav/primary', function(hooks) {
+module('Integration | Component | rose/nav/sidebar', function(hooks) {
   setupRenderingTest(hooks);
 
   test('it renders', async function(assert) {
     assert.expect(2)
     await render(hbs`
-      <Rose::Nav::Primary @title="Title" as |nav|>
+      <Rose::Nav::Sidebar @title="Title" as |nav|>
         <nav.link @route="index">Item Name</nav.link>
-      </Rose::Nav::Primary>
+      </Rose::Nav::Sidebar>
     `);
     assert.equal(find('.rose-nav-title').textContent.trim(), 'Title');
     assert.equal(find('.rose-nav-link').textContent.trim(), 'Item Name');
@@ -20,15 +20,14 @@ module('Integration | Component | rose/nav/primary', function(hooks) {
   test('it associates title with nav via aria-labelledby', async function (assert) {
     assert.expect(2)
     await render(hbs`
-      <Rose::Nav::Primary @title="Title" as |nav|>
+      <Rose::Nav::Sidebar @title="Title" as |nav|>
         <nav.link @route="index">Item Name</nav.link>
-      </Rose::Nav::Primary>
+      </Rose::Nav::Sidebar>
     `);
-    const el = find('.rose-nav-primary');
+    const el = find('.rose-nav-sidebar');
     const id = el.id;
     const titleId = `title-${id}`;
-    const titleEl = find('.rose-nav-title');
-    assert.equal(titleEl.id, titleId);
+    assert.equal(find('.rose-nav-title').id, titleId);
     assert.equal(el.getAttribute('aria-labelledby').trim(), titleId);
   });
 });

ui/core/app/styles/app.scss

@@ -3,7 +3,7 @@
 @import 'rose';
 @import 'notify';
 
-.rose-nav-primary {
+.rose-nav-sidebar {
   margin-top: sizing.rems(xxl);
 }
 

ui/core/app/templates/application.hbs

@@ -33,10 +33,10 @@
   </page.main>
 
   <page.sidebar>
-    <Rose::Nav::Primary @title={{t 'dev.title'}} as |nav|>
+    <Rose::Nav::Sidebar @title={{t 'dev.title'}} as |nav|>
       <nav.link @route="orgs" class="active">{{t 'dev.item-name'}}</nav.link>
       <nav.link @route="index">{{t 'dev.item-name'}}</nav.link>
-    </Rose::Nav::Primary>
+    </Rose::Nav::Sidebar>
   </page.sidebar>
 
 </Rose::Layout::Page>