import { Observable , Subject , defer , distinctUntilKeyChanged , finalize , map , of , switchMap , tap } from "rxjs" ; import { feature } from "~/_" ; import { Viewport , watchElementSize , watchViewportAt } from "~/browser" ; import { Component } from "../_" ; import { Header } from "../header" ; /**
 * Navigation tabs
 */ export interface Tabs { hidden : boolean ; } /**
 * Watch options
 */ interface WatchOptions { viewport$ : Observable < Viewport > ; header$ : Observable < Header > ; } /**
 * Mount options
 */ interface MountOptions { viewport$ : Observable < Viewport > ; header$ : Observable < Header > ; } param el param options returns export function watchTabs ( el , { viewport$ , header$ } ) { return watchElementSize ( document . body ) . pipe ( switchMap ( ( ) => watchViewportAt ( el , { header$ , viewport$ } ) ) , map ( ( { offset : { y } } ) => { return { hidden : y >= 10 } ; } ) , distinctUntilKeyChanged ( "hidden" ) ) ; } param el param options returns export function mountTabs ( el , options ) { return defer ( ( ) => { const push$ = new Subject < Tabs > ( ) ; push$ . subscribe ( { next ( { hidden } ) { if ( hidden ) el . setAttribute ( "data-md-state" , "hidden" ) ; else el . removeAttribute ( "data-md-state" ) ; } , complete ( ) { el . removeAttribute ( "data-md-state" ) ; } } ) ; return ( feature ( "navigation.tabs.sticky" ) ? of ( { hidden : false } ) : watchTabs ( el , options ) ) . pipe ( tap ( state => push$ . next ( state ) ) , finalize ( ( ) => push$ . complete ( ) ) , map ( state => ( { ref : el , ... state } ) ) ) ; } ) ; }