import { fromInterval } from "@thi.ng/rstream/interval" ; import { stream } from "@thi.ng/rstream/stream" ; import { sync } from "@thi.ng/rstream/sync" ; import { updateDOM } from "@thi.ng/transducers-hdom" ; import { count } from "@thi.ng/transducers/count" ; import { map } from "@thi.ng/transducers/map" ; import { scan } from "@thi.ng/transducers/scan" ; const app = ( { ticks , clicks } ) => [ "div.vh-100.dt.w-100.bg-dark-pink.sans-serif" , [ "div.dtc.v-mid.tc.white.ph3.ph4-l" , [ "h1.f6.f2-m.f-subheadline-l.fw1.tc" , `${ ticks } ticks & ` , [ "a.link.white.bb.bw1" , { href : "#" , onclick : ( ) => clickStream . next ( 0 ) } , `${ clicks } clicks` , ] , ] , [ "div" , [ "a.link.white" , { href : "https://github.com/thi-ng/umbrella/tree/develop/examples/transducers-hdom/" , } , "Source code" , ] , ] , ] , ] ; const clickStream = stream ( ) . transform ( scan ( count ( - 1 ) ) ) ; sync ( { src : { ticks : fromInterval ( 1000 ) , clicks : clickStream , } , reset : false , } ) . transform ( map ( app ) , updateDOM ( ) ) ; clickStream . next ( 0 ) ;