[
  {
    "tags": [
      {
        "type": "component",
        "string": "nav",
        "html": "<p>nav</p>"
      },
      {
        "type": "param",
        "string": "{bindable} router (aurelia-router)",
        "name": "router",
        "description": "<p>(aurelia-router)</p>",
        "types": [
          "bindable"
        ],
        "typesDescription": "<a href=\"bindable.html\">bindable</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false
      },
      {
        "type": "param",
        "string": "{bindable} normalizeTitle (f: NavModel => string)",
        "name": "normalizeTitle",
        "description": "<p>(f: NavModel =&gt; string)</p>",
        "types": [
          "bindable"
        ],
        "typesDescription": "<a href=\"bindable.html\">bindable</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false
      },
      {
        "type": "param",
        "string": "{pseudo} default",
        "name": "default",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} default</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} primary",
        "name": "primary",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} primary</p>"
      },
      {
        "type": "param",
        "string": "{pseudo} center",
        "name": "center",
        "description": "",
        "types": [
          "pseudo"
        ],
        "typesDescription": "<a href=\"pseudo.html\">pseudo</a>",
        "optional": false,
        "nullable": false,
        "nonNullable": false,
        "variable": false,
        "html": "<p>{pseudo} center</p>"
      },
      {
        "type": "section.usage",
        "string": "",
        "html": ""
      },
      {
        "type": "usage.title",
        "string": "Usage",
        "html": "<p>Usage</p>"
      },
      {
        "type": "usage.description",
        "string": "Bind a router to have aire-nav iterate over NavModels and list out elements. To change how the text displays, pass in a normalizeTitle function.",
        "html": "<p>Bind a router to have aire-nav iterate over NavModels and list out elements. To change how the text displays, pass in a normalizeTitle function.</p>"
      },
      {
        "type": "usage.examples.Router",
        "string": "aire-nav(router.bind=\"router\")",
        "html": "<p>aire-nav(router.bind=&quot;router&quot;)</p>"
      },
      {
        "type": "section.style",
        "string": "",
        "html": ""
      },
      {
        "type": "style.title",
        "string": "Style",
        "html": "<p>Style</p>"
      },
      {
        "type": "style.description",
        "string": "In addition to its relatively unstyled state, a nav can be made to be `default`, `primary` or `center`:",
        "html": "<p>In addition to its relatively unstyled state, a nav can be made to be <code>default</code>, <code>primary</code> or <code>center</code>:</p>"
      },
      {
        "type": "style.examples.Default",
        "string": "aire-nav(router.bind=\"router\" default)",
        "html": "<p>aire-nav(router.bind=&quot;router&quot; default)</p>"
      },
      {
        "type": "style.examples.Primary",
        "string": "aire-nav(router.bind=\"router\" primary)",
        "html": "<p>aire-nav(router.bind=&quot;router&quot; primary)</p>"
      },
      {
        "type": "style.examples.Center",
        "string": "aire-nav(router.bind=\"router\" center)",
        "html": "<p>aire-nav(router.bind=&quot;router&quot; center)</p>"
      }
    ],
    "description": {
      "full": "<p>The aire-nav component is a styled list that takes a router to automatically lay out and link up navigation.</p>",
      "summary": "<p>The aire-nav component is a styled list that takes a router to automatically lay out and link up navigation.</p>",
      "body": ""
    },
    "isPrivate": false,
    "isConstructor": false,
    "isClass": false,
    "isEvent": false,
    "ignore": false,
    "line": 13,
    "codeStart": 52,
    "code": "@inject(EventAggregator, Element)\n@customElement('aire-nav')\nexport class AireNav {\n\n  @bindable\n  private router : Router;\n\n  @bindable\n  normalizeTitle : (n : NavModel) => string;\n\n  ul : HTMLElement;\n\n  constructor(readonly bus : EventAggregator, private element : Element) {\n\n  }\n\n  protected navigation() : NavModel[] {\n    if (this.router) {\n      let nav = this.router.navigation,\n        current = new Map<string, NavModel>();\n      for (let n of nav) {\n        current.set(n.config.title, n);\n      }\n      return Array.from(current.values());\n    } else {\n      return [];\n    }\n  }\n\n  fire() {\n    this.bus.publish(Events.NavigationEvent.ITEM_CLICKED, {});\n    return true;\n  }\n\n\n  attached() {\n    dom.decorateTo(this.element, this.ul, \"default\", \"uk-nav-default\");\n    dom.decorateTo(this.element, this.ul, \"primary\", \"uk-nav-primary\");\n    dom.decorateTo(this.element, this.ul, \"center\", \"uk-nav-center\");\n  }\n\n}",
    "ctx": false
  }
]