diff --git a/src/nav/NavBar.component.ts b/src/nav/NavBar.component.ts
index ad28c4d..1fe1082 100644
--- a/src/nav/NavBar.component.ts
+++ b/src/nav/NavBar.component.ts
@@ -51,18 +51,26 @@ export class NavBarComponent extends ExComponent {
color: var(--color-accent-text);
}
- span.appName {
+ span {
font-size: 1.2em;
font-weight: bold;
padding: 14px;
padding-right: 30px;
padding-left: 0;
}
+
+ .items-container {
+ display: none;
+ }
+
+
+
`
@Renders()
@@ -84,7 +92,7 @@ export class NavBarComponent extends ExComponent {
this.appNameEl.innerText = this.appName || ''
this.list.childNodes.forEach(x => x.remove())
- for ( const item of this.items ) {
+ for ( const item of this.getItems() ) {
const li = document.createElement('li')
const a = document.createElement('a')
li.appendChild(a)
@@ -101,6 +109,32 @@ export class NavBarComponent extends ExComponent {
}
}
+ getItems(): NavBarItem[] {
+ const itemEls = this.querySelectorAll('ex-nav-item').values()
+ const items = []
+
+ for ( const itemEl of itemEls ) {
+ const title = itemEl.getAttribute('title')
+ const name = itemEl.getAttribute('name')
+ if ( title && name ) {
+ const item: NavBarItem = {
+ title,
+ name,
+ right: itemEl.hasAttribute('right'),
+ }
+
+ const href = itemEl.getAttribute('href')
+ if ( href ) {
+ item.href = href
+ }
+
+ items.push(item)
+ }
+ }
+
+ return items
+ }
+
dispatchItemClick(name: string) {
return this.dispatchCustom('onItemClick', { name })
}