Removed unnecessary share replays

material/assets/manifest.json

@@ -1,12 +1,12 @@
 {
-  "assets/javascripts/bundle.js": "assets/javascripts/bundle.a8472eec.min.js",
-  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.a8472eec.min.js.map",
-  "assets/javascripts/vendor.js": "assets/javascripts/vendor.d1f5a259.min.js",
-  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.d1f5a259.min.js.map",
+  "assets/javascripts/bundle.js": "assets/javascripts/bundle.d2ae5e32.min.js",
+  "assets/javascripts/bundle.js.map": "assets/javascripts/bundle.d2ae5e32.min.js.map",
+  "assets/javascripts/vendor.js": "assets/javascripts/vendor.9b93e5e7.min.js",
+  "assets/javascripts/vendor.js.map": "assets/javascripts/vendor.9b93e5e7.min.js.map",
   "assets/javascripts/worker/search.js": "assets/javascripts/worker/search.fae956e7.min.js",
   "assets/javascripts/worker/search.js.map": "assets/javascripts/worker/search.fae956e7.min.js.map",
-  "assets/stylesheets/main.css": "assets/stylesheets/main.2c939256.min.css",
-  "assets/stylesheets/main.css.map": "assets/stylesheets/main.2c939256.min.css.map",
+  "assets/stylesheets/main.css": "assets/stylesheets/main.c1355826.min.css",
+  "assets/stylesheets/main.css.map": "assets/stylesheets/main.c1355826.min.css.map",
   "assets/stylesheets/overrides.css": "assets/stylesheets/overrides.011ebae6.min.css",
   "assets/stylesheets/overrides.css.map": "assets/stylesheets/overrides.011ebae6.min.css.map",
   "assets/stylesheets/palette.css": "assets/stylesheets/palette.2c2767bb.min.css",

material/base.html

@@ -41,7 +41,7 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.2c939256.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.c1355826.min.css' | url }}">
       {% if palette.scheme or palette.primary or palette.accent %}
         <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.2c2767bb.min.css' | url }}">
       {% endif %}
@@ -182,8 +182,8 @@ <h1>{{ page.title | default(config.site_name, true)}}</h1>
       {% endblock %}
     </div>
     {% block scripts %}
-      <script src="{{ 'assets/javascripts/vendor.d1f5a259.min.js' | url }}"></script>
-      <script src="{{ 'assets/javascripts/bundle.a8472eec.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/vendor.9b93e5e7.min.js' | url }}"></script>
+      <script src="{{ 'assets/javascripts/bundle.d2ae5e32.min.js' | url }}"></script>
       {%- set translations = {} -%}
       {%- for key in [
         "clipboard.copy",

src/assets/javascripts/components/_/index.ts

@@ -137,7 +137,7 @@ export function setupComponents(
       }),
 
       /* Convert to hot observable */
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 }
 

src/assets/javascripts/components/header/_/index.ts

@@ -25,7 +25,6 @@ import {
   distinctUntilChanged,
   filter,
   map,
-  shareReplay,
   startWith,
   switchMap,
   withLatestFrom
@@ -116,8 +115,7 @@ export function mountHeader(
       /* Combine into single observable */
       return combineLatest([header$, type$])
         .pipe(
-          map(([header, type]): Header => ({ type, ...header })),
-          shareReplay(1)
+          map(([header, type]): Header => ({ type, ...header }))
         )
     })
   )

src/assets/javascripts/components/header/react/index.ts

@@ -96,7 +96,7 @@ export function watchHeader(
           })
         }
       }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 }
 

src/assets/javascripts/components/main/react/index.ts

@@ -34,7 +34,6 @@ import {
   map,
   observeOn,
   pluck,
-  shareReplay,
   switchMap,
   tap
 } from "rxjs/operators"
@@ -84,8 +83,7 @@ export function watchMain(
   const adjust$ = header$
     .pipe(
       pluck("height"),
-      distinctUntilChanged(),
-      shareReplay(1)
+      distinctUntilChanged()
     )
 
   /* Compute the main area's top and bottom borders */
@@ -96,11 +94,10 @@ export function watchMain(
           map(({ height }) => ({
             top:    el.offsetTop,
             bottom: el.offsetTop + height
-          }))
+          })),
+          distinctUntilKeyChanged("bottom")
         )
-      ),
-      distinctUntilKeyChanged("bottom"),
-      shareReplay(1)
+      )
     )
 
   /* Compute the main area's offset, visible height and if we scrolled past */

src/assets/javascripts/components/navigation/index.ts

@@ -20,4 +20,91 @@
  * IN THE SOFTWARE.
  */
 
-export * from "./_"
+import { Observable, OperatorFunction, of, pipe } from "rxjs"
+import { map, switchMap } from "rxjs/operators"
+
+import { Viewport } from "browser"
+
+import { Header } from "../header"
+import { Main } from "../main"
+import {
+  Sidebar,
+  applySidebar,
+  watchSidebar
+} from "../shared"
+
+/* ----------------------------------------------------------------------------
+ * Types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Navigation for [screen -]
+ */
+interface NavigationBelowScreen {} // tslint:disable-line
+
+/**
+ * Navigation for [screen +]
+ */
+interface NavigationAboveScreen {
+  sidebar: Sidebar                     /* Sidebar */
+}
+
+/* ------------------------------------------------------------------------- */
+
+/**
+ * Navigation
+ */
+export type Navigation =
+  | NavigationBelowScreen
+  | NavigationAboveScreen
+
+/* ----------------------------------------------------------------------------
+ * Helper types
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Mount options
+ */
+interface MountOptions {
+  header$: Observable<Header>          /* Header observable */
+  main$: Observable<Main>              /* Main area observable */
+  viewport$: Observable<Viewport>      /* Viewport observable */
+  screen$: Observable<boolean>         /* Screen media observable */
+}
+
+/* ----------------------------------------------------------------------------
+ * Functions
+ * ------------------------------------------------------------------------- */
+
+/**
+ * Mount navigation from source observable
+ *
+ * @param options - Options
+ *
+ * @return Operator function
+ */
+export function mountNavigation(
+  { header$, main$, viewport$, screen$ }: MountOptions
+): OperatorFunction<HTMLElement, Navigation> {
+  return pipe(
+    switchMap(el => screen$
+      .pipe(
+        switchMap(screen => {
+
+          /* [screen +]: Mount navigation in sidebar */
+          if (screen) {
+            return watchSidebar(el, { main$, viewport$ })
+              .pipe(
+                applySidebar(el, { header$ }),
+                map(sidebar => ({ sidebar }))
+              )
+
+          /* [screen -]: Mount navigation in drawer */
+          } else {
+            return of({})
+          }
+        })
+      )
+    )
+  )
+}

src/assets/javascripts/index.ts

@@ -200,39 +200,39 @@ export function initialize(config: unknown) {
   const header$ = useComponent("header")
     .pipe(
       mountHeader({ document$, viewport$ }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   const main$ = useComponent("main")
     .pipe(
       mountMain({ header$, viewport$ }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   /* ----------------------------------------------------------------------- */
 
   const navigation$ = useComponent("navigation")
     .pipe(
       mountNavigation({ header$, main$, viewport$, screen$ }),
-      shareReplay(1) // shareReplay because there might be late subscribers
+      shareReplay({ bufferSize: 1, refCount: true }) // shareReplay because there might be late subscribers
     )
 
   const toc$ = useComponent("toc")
     .pipe(
       mountTableOfContents({ header$, main$, viewport$, tablet$ }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   const tabs$ = useComponent("tabs")
     .pipe(
       mountTabs({ header$, viewport$, screen$ }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   const hero$ = useComponent("hero")
     .pipe(
       mountHero({ header$, viewport$ }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   /* ----------------------------------------------------------------------- */
@@ -277,21 +277,21 @@ export function initialize(config: unknown) {
         const query$ = useComponent("search-query")
           .pipe(
             mountSearchQuery(worker, { transform: config.search.transform }),
-            shareReplay(1)
+            shareReplay({ bufferSize: 1, refCount: true })
           )
 
         /* Mount search reset */
         const reset$ = useComponent("search-reset")
           .pipe(
             mountSearchReset(),
-            shareReplay(1)
+            shareReplay({ bufferSize: 1, refCount: true })
           )
 
         /* Mount search result */
         const result$ = useComponent("search-result")
           .pipe(
             mountSearchResult(worker, { query$ }),
-            shareReplay(1)
+            shareReplay({ bufferSize: 1, refCount: true })
           )
 
         return useComponent("search")
@@ -304,7 +304,7 @@ export function initialize(config: unknown) {
           .subscribe(el => el.hidden = true) // TODO: Hack
         return NEVER
       }),
-      shareReplay(1)
+      shareReplay({ bufferSize: 1, refCount: true })
     )
 
   /* ----------------------------------------------------------------------- */