build(docs-infra): package entry points API templates

aio/tools/transforms/angular-api-package/processors/computeApiBreadCrumbs.js

@@ -8,11 +8,27 @@ module.exports = function computeApiBreadCrumbs(API_DOC_TYPES_TO_RENDER) {
         if (API_DOC_TYPES_TO_RENDER.indexOf(doc.docType) !== -1) {
           doc.breadCrumbs = [];
           doc.breadCrumbs.push({ text: 'API', path: '/api' });
-          if (doc.moduleDoc) doc.breadCrumbs.push({ text: '@angular/' + doc.moduleDoc.id, path: doc.moduleDoc.path });
+          if (isSecondaryEntryPoint(doc)) {
+            doc.breadCrumbs.push(createPackageBreadcrumb(doc));
+          }
+          if (doc.moduleDoc) {
+            if (isSecondaryEntryPoint(doc.moduleDoc)) {
+              doc.breadCrumbs.push(createPackageBreadcrumb(doc.moduleDoc));
+            }
+            doc.breadCrumbs.push({ text: '@angular/' + doc.moduleDoc.id, path: doc.moduleDoc.path });
+          }
           doc.breadCrumbs.push({ text: doc.name, path: doc.path });
         }
+
       });
     }
   };
 };
 
+function isSecondaryEntryPoint(doc) {
+  return doc.docType === 'package' && !doc.isPrimaryPackage;
+}
+
+function createPackageBreadcrumb(doc) {
+  return { text: doc.packageInfo.primary.name, path: doc.packageInfo.primary.path };
+}

aio/tools/transforms/angular-api-package/processors/computeApiBreadCrumbs.spec.js

@@ -17,11 +17,17 @@ describe('angular-api-package: computeApiBreadCrumbs processor', () => {
     const API_DOC_TYPES_TO_RENDER = ['class', 'interface', 'package'];
     const processor = processorFactory(API_DOC_TYPES_TO_RENDER);
 
+    const httpPackage = { docType: 'package', name: '@angular/http', id: 'http', path: 'http', isPrimaryPackage: true };
+    const httpTestingPackage = { docType: 'package', name: '@angular/http/testing', id: 'http/testing', path: 'http/testing', packageInfo: { primary: httpPackage } };
+    const testRequestClass = { docType: 'class', name: 'TestRequest', path: 'http/testing/test-request', moduleDoc: httpTestingPackage };
+
     const docs = [
       { docType: 'class', name: 'ClassA', path: 'module-1/class-a', moduleDoc: { id: 'moduleOne', path: 'module-1' } },
       { docType: 'interface', name: 'InterfaceB', path: 'module-2/interface-b', moduleDoc: { id: 'moduleTwo', path: 'module-2' } },
       { docType: 'guide', name: 'Guide One', path: 'guide/guide-1' },
-      { docType: 'package', name: 'testing', id: 'http/testing', path: 'http/testing' },
+      httpPackage,
+      httpTestingPackage,
+      testRequestClass
     ];
     processor.$process(docs);
 
@@ -38,7 +44,18 @@ describe('angular-api-package: computeApiBreadCrumbs processor', () => {
     expect(docs[2].breadCrumbs).toBeUndefined();
     expect(docs[3].breadCrumbs).toEqual([
       { text: 'API', path: '/api' },
-      { text: 'testing', path: 'http/testing' },
+      { text: '@angular/http', path: 'http' },
+    ]);
+    expect(docs[4].breadCrumbs).toEqual([
+      { text: 'API', path: '/api' },
+      { text: '@angular/http', path: 'http' },
+      { text: '@angular/http/testing', path: 'http/testing' },
+    ]);
+    expect(docs[5].breadCrumbs).toEqual([
+      { text: 'API', path: '/api' },
+      { text: '@angular/http', path: 'http' },
+      { text: '@angular/http/testing', path: 'http/testing' },
+      { text: 'TestRequest', path: 'http/testing/test-request' },
     ]);
   });
 });

aio/tools/transforms/templates/api/base.template.html

@@ -1,6 +1,6 @@
 {% import "lib/githubLinks.html" as github -%}
 {% set comma = joiner(',') %}
-{% set slash = joiner('/') %}
+{% set breadcrumbDelimiter = joiner('>') %}
 <article>
   {$ github.githubLinks(doc, versionInfo) $}
   <div class="breadcrumb">
@@ -14,14 +14,11 @@
         ]
       }
     </script>
-    {% for crumb in doc.breadCrumbs %}{% if not loop.last %} {$ slash() $} {% if crumb.path %}<a href="{$ crumb.path $}">{$ crumb.text $}</a>{% else %}{$ crumb.text $}{% endif %}{% endif %}{% endfor %}
+    {% for crumb in doc.breadCrumbs %}{% if not loop.last %} {$ breadcrumbDelimiter() $} {% if crumb.path %}<a href="{$ crumb.path $}">{$ crumb.text $}</a>{% else %}{$ crumb.text $}{% endif %}{% endif %}{% endfor %}
   </div>
   <header class="api-header">
     <h1>{$ doc.name $}</h1>
     <label class="api-type-label {$ doc.docType $}">{$ doc.docType $}</label>
-    {% if doc.deprecated !== undefined %}<label class="api-status-label deprecated">deprecated</label>{% endif %}
-    {% if doc.experimental !== undefined %}<label class="api-status-label experimental">experimental</label>{% endif %}
-    {% if doc.stable !== undefined %}<label class="api-status-label stable">stable</label>{% endif %}
     {% if doc.pipeOptions.pure === 'false' %}<label class="api-status-label impure-pipe">impure</label>{% endif %}
   </header>
   <aio-toc class="embedded"></aio-toc>

aio/tools/transforms/templates/api/package.template.html

@@ -1,14 +1,14 @@
 {% extends 'base.template.html' -%}
 
-{% macro listItems(items, title) %}
+{% macro listItems(items, title, overridePath) %}
   {% if items.length %}
   <section class="export-list">
     <h3>{$ title $}</h3>
     <table class="is-full-width list-table">
       {% for item in items %}
       <tr>
         <td><code class="code-anchor">
-          <a href="{$ item.path $}">{$ item.name $}</a></code></td>
+          <a href="{$ overridePath or item.path $}">{$ item.name $}</a></code></td>
         <td>{% if item.shortDescription %}{$ item.shortDescription | marked $}{% endif %}</td>
       </tr>
       {% endfor %}
@@ -24,12 +24,13 @@ <h3>{$ title $}</h3>
 
   {% include "includes/see-also.html" %}
 
+  {% if doc.isPrimaryPackage %}
   <h2>Entry points</h2>
-  {$ listItems([doc.packageInfo.primary], 'Primary') $}
+  {$ listItems([doc.packageInfo.primary], 'Primary', '#primary-entry-point-exports') $}
   {$ listItems(doc.packageInfo.secondary, 'Secondary') $}
+  {% endif %}
 
-
-  <h2>Exports</h2>
+  <h2>{% if doc.isPrimaryPackage %}Primary entry{% else %}Entry{% endif %} point exports</h2>
   {$ listItems(doc.classes, 'Classes') $}
   {$ listItems(doc.decorators, 'Decorators') $}
   {$ listItems(doc.functions, 'Functions') $}