{
  "file": "addon/components/fountainhead-pages/api.js",
  "content": "<pre class=\"language-javascript line-numbers\"><code class=\"language-javascript}\"><span aria-hidden=\"true\" role=\"presentation\" class=\"line-numbers-rows\"><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span></span><span class=\"token keyword\">import</span> Component <span class=\"token keyword\">from</span> <span class=\"token string\">'ember-component'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> hbs <span class=\"token keyword\">from</span> <span class=\"token string\">'htmlbars-inline-precompile'</span><span class=\"token punctuation\">;</span>\n<span class=\"token keyword\">import</span> inject <span class=\"token keyword\">from</span> <span class=\"token string\">'ember-service/inject'</span><span class=\"token punctuation\">;</span>\n\n<span class=\"token comment\" spellcheck=\"true\">/**\n * Fountainhead `/api` page component handles rendering the API sidebar, welcome\n * messaging and all API related subroutes including modules, classes and source\n * files. The `outlet` for this route is yielded by this component, which\n * is how we use components to handle rendering all of our pages, even with\n * subroutes.\n *\n * Because we want the default setup of Fountainhead to look like it's own app\n * we render everything in a `fh-page-in-page-wrapper` wrapper which is position\n * fixed to cover the entire screen. This allows us to have our own header and\n * footer even if a consuming application has one in their `application.hbs`\n * template.\n *\n * Page data is passed from the `fountainhead` service, which is the primary\n * store for the addon and handles fetching the meta data for the API docs.\n * @class FountainheadPages.API\n * @uses FountainheadRepoLink\n * @uses FountainheadSidebar.Sidebar\n * @constructor\n * @extends Ember.Component\n */</span>\n<span class=\"token keyword\">export</span> <span class=\"token keyword\">default</span> Component<span class=\"token punctuation\">.</span><span class=\"token function\">extend</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">{</span>\n  fountainhead<span class=\"token punctuation\">:</span> <span class=\"token function\">inject</span><span class=\"token punctuation\">(</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">,</span>\n\n  <span class=\"token comment\" spellcheck=\"true\">// Properties</span>\n  <span class=\"token comment\" spellcheck=\"true\">// ---------------------------------------------------------------------------</span>\n  <span class=\"token comment\" spellcheck=\"true\">/**\n   * @property tagName\n   * @type {string}\n   * @default ''\n   */</span>\n  tagName<span class=\"token punctuation\">:</span> <span class=\"token string\">''</span><span class=\"token punctuation\">,</span>\n\n  <span class=\"token comment\" spellcheck=\"true\">// Layout</span>\n  <span class=\"token comment\" spellcheck=\"true\">// ---------------------------------------------------------------------------</span>\n  layout<span class=\"token punctuation\">:</span> hbs<span class=\"token template-string\"><span class=\"token string\">`\n    &lt;div class='fh-page-in-page-wrapper'>\n      {{! Octocat page corner SVG logo }}\n      {{fountainhead-repo-link repository=fountainhead.meta.repository}}\n\n      &lt;main class='fh-container'>\n        {{navigation-api meta=fountainhead.meta}}\n        &lt;div class='fh-content-container'>\n          &lt;div class='fh-content api-documentation'>\n            {{! This is where subroutes are rendered through the outlet }}\n            {{yield}}\n          &lt;/div>\n        &lt;/div>\n      &lt;/main>\n    &lt;/div>\n  `</span></span>\n<span class=\"token punctuation\">}</span><span class=\"token punctuation\">)</span><span class=\"token punctuation\">;</span>\n</code></pre>"
}