dlg-ui 1.0.8 → 1.0.10

package/addon/components/content.hbs

@@ -0,0 +1,8 @@
+<div class='content-wrapper'>
+  <div class='content-header'>
+    {{yield to='header'}}
+  </div>
+  <div class='content-body'>
+    {{yield to='body'}}
+  </div>
+</div>

package/addon/components/header-dropdown.hbs

@@ -4,7 +4,7 @@
 >
   <div class='header-dropdown-select {{if this.isOpen "open"}}'>
     <span class='header-dropdown-selected'>
-      {{this.selectedOption.label}}
+      {{this.displaySelectedOption}}
     </span>
   </div>
   <div

package/addon/components/header-dropdown.js

@@ -4,7 +4,15 @@ import { tracked } from '@glimmer/tracking';
 
 export default class DropdownComponent extends Component {
   @tracked isOpen = false;
-  @tracked _selectedOption = this.args.selectedOption;
+  @tracked _selectedOption = this.selectedOption;
+
+  get displaySelectedOption() {
+    if (this._selectedOption) {
+      return this._selectedOption.label;
+    } else {
+      return this.placeholder;
+    }
+  }
 
   get selectedOption() {
     if (this.args.selectedOption) {
@@ -30,9 +38,6 @@ export default class DropdownComponent extends Component {
     if (!this.args.options) {
       throw new Error('Dropdown requires an options array');
     }
-    if (!this.args.selectedOption) {
-      throw new Error('Header dropdown requires a selected option');
-    }
   }
 
   saveSelection(value) {

package/addon/components/navbar.hbs

@@ -23,8 +23,8 @@
               @options={{option.dropdownOptions}}
               @placeholder={{option.placeholder}}
               @onSelect={{this.onSelect}}
-              @selectedOption={{option}}
-              @preventDefault={{true}}
+              @selectedOption={{this.selectedOption}}
+              @preventDefault={{option.preventDefault}}
             />
           </div>
         {{/if}}

package/addon/components/navbar.js

@@ -1,9 +1,11 @@
 import Component from '@glimmer/component';
 import { action } from '@ember/object';
 import { service } from '@ember/service';
+import { tracked } from '@glimmer/tracking';
 
 export default class NavbarComponent extends Component {
   @service router;
+  @tracked selectedOption = null;
 
   get title() {
     return this.args.title || 'dlg-ui';
@@ -31,6 +33,7 @@ export default class NavbarComponent extends Component {
 
   @action
   onSelect(value) {
+    this.selectedOption = value;
     if (this.args.onSelect) {
       this.args.onSelect(value);
     }

package/addon/styles/addon.css

@@ -2,6 +2,25 @@
   cursor: pointer;
 }
 
+.content-wrapper {
+  display: flex;
+  height: 100%;
+  width: 100%;
+  flex-direction: column;
+  padding: 1em;
+}
+
+.content-header {
+  min-height: 20%;
+  height: fit-content;
+  margin-bottom: 1em;
+}
+
+.content-body {
+  min-height: 80%;
+  height: fit-content;
+}
+
 .dropdown-option {
   border-bottom-style: solid;
   border-width: 2px;

package/app/components/content.js

@@ -0,0 +1 @@
+export { default } from 'dlg-ui/components/content';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dlg-ui",
-  "version": "1.0.8",
+  "version": "1.0.10",
   "description": "The default blueprint for ember-cli addons.",
   "keywords": [
     "ember-addon"