feat(nav): add nav components

addon/components/nav.hbs

@@ -0,0 +1,5 @@
+<ul
+  class="uk-subnav uk-subnav-divider uk-subnav-pill uk-width-1 uk-child-width-1-4 uk-text-center uk-padding-small uk-padding-remove-horizontal"
+>
+  {{yield}}
+</ul>

addon/components/nav/item.hbs

@@ -0,0 +1,5 @@
+<li class="uk-child-width-1-1 {{if this.isActive 'uk-active'}}" ...attributes>
+  <LinkTo @route={{@route}}>
+    {{yield}}
+  </LinkTo>
+</li>

addon/components/nav/item.js

@@ -0,0 +1,10 @@
+import { inject as service } from "@ember/service";
+import Component from "@glimmer/component";
+
+export default class NavItemComponent extends Component {
+  @service router;
+
+  get isActive() {
+    return this.router.currentRoute.name.includes(this.args.route);
+  }
+}

app/components/nav.js

@@ -0,0 +1 @@
+export { default } from "ember-emeis/components/nav";

app/components/nav/item.js

@@ -0,0 +1 @@
+export { default } from "ember-emeis/components/nav/item";

tests/integration/components/nav-test.js

@@ -0,0 +1,19 @@
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import { setupRenderingTest } from "ember-qunit";
+import { module, test } from "qunit";
+
+module("Integration | Component | nav", function (hooks) {
+  setupRenderingTest(hooks);
+
+  test("it renders", async function (assert) {
+    await render(hbs`
+      <Nav>
+        <li>Nav 1</li>
+        <li>Nav 2</li>
+      </Nav>
+    `);
+
+    assert.dom("ul li").exists({ count: 2 });
+  });
+});

tests/integration/components/nav/item-test.js

@@ -0,0 +1,28 @@
+import { render } from "@ember/test-helpers";
+import { hbs } from "ember-cli-htmlbars";
+import { setupRenderingTest } from "ember-qunit";
+import { module, test } from "qunit";
+
+module("Integration | Component | nav/item", function (hooks) {
+  setupRenderingTest(hooks);
+
+  test("it renders", async function (assert) {
+    this.set("route", "test");
+
+    this.set("router", this.owner.lookup("router:main"));
+    this.set("router.currentRoute", { name: "someotherroute" });
+
+    await render(hbs`
+      <Nav::Item @route={{this.route}}>
+        Test
+      </Nav::Item>
+    `);
+
+    assert.dom("li").doesNotHaveClass("uk-active");
+    assert.dom("li a").hasText("Test");
+
+    this.set("router.currentRoute", { name: "some.test" });
+
+    assert.dom("li").hasClass("uk-active");
+  });
+});