diff --git a/.github/workflows/nodejs.yml b/.github/workflows/nodejs.yml
index 16eaa87..15b4646 100644
--- a/.github/workflows/nodejs.yml
+++ b/.github/workflows/nodejs.yml
@@ -21,6 +21,6 @@ jobs:
       run: |
         npm set audit false
         npm install
-        pika build
+        node_modules/.bin/pika build
       env:
         CI: true
diff --git a/.idea/inspectionProfiles/Project_Default.xml b/.idea/inspectionProfiles/Project_Default.xml
index 2d93a34..b5202ce 100644
--- a/.idea/inspectionProfiles/Project_Default.xml
+++ b/.idea/inspectionProfiles/Project_Default.xml
@@ -37,6 +37,7 @@
       <option name="myCustomValuesEnabled" value="true" />
     </inspection_tool>
     <inspection_tool class="TsLint" enabled="true" level="WARNING" enabled_by_default="true" />
+    <inspection_tool class="TypeScriptPreferShortImport" enabled="false" level="WARNING" enabled_by_default="false" />
     <inspection_tool class="UnterminatedStatementJS" enabled="false" level="WARNING" enabled_by_default="false">
       <option name="ignoreSemicolonAtEndOfBlock" value="true" />
     </inspection_tool>
diff --git a/DECORATORS.md b/DECORATORS.md
new file mode 100644
index 0000000..9522d28
--- /dev/null
+++ b/DECORATORS.md
@@ -0,0 +1,97 @@
+# Experimental Decorators
+
+Bubblesub comes with experimental `@pub` and `@sub` decorators. The interop with LitElement is not great. It is not clear if they are a good idea in the end
+
+## Example Usage
+
+Here is an example on StackBlitz that integrates with [lit-element](https://lit-element.polymer-project.org/) :
+[StackBlitz Example](https://stackblitz.com/edit/bubblesub-demo) 
+
+## Publishing
+
+Here is an example of a higher-level component that publishes a calculator as a service. 
+
+```typescript
+import { LitElement, customElement, html } from 'lit-element'
+import { pub } from 'bubblesub'
+import { Calculator } from 'calculator'
+
+//Parent calculator component
+@customElement('demo-calculator')
+class App extends LitElement {
+
+  @pub()
+  calc: Calculator = new Calculator()
+
+  render() {
+    return html`<h1>Calculator</h1><slot></slot>`;
+  }
+}
+
+```
+
+## Subscribing
+
+Here is a child element that can be repeated as many times as is needed.
+
+```typescript
+import { LitElement, customElement, html } from 'lit-element'
+import { sub } from 'bubblesub'
+import { Calculator } from 'calculator'
+
+@customElement('demo-val')
+class Value extends LitElement {
+
+  @sub()
+  calc: Calculator
+
+  render() {
+    return html`
+    <input 
+      type="number" 
+      @change="${(e) => { this.calc.set(parseInt(this.id), parseInt(e.target.value)) }}" >
+    </input>`
+  }
+}
+
+```
+
+Here is a child element that displays the total of the calculation
+
+```typescript
+import { LitElement, customElement, html } from 'lit-element'
+import { sub } from 'bubblesub'
+import { Calculator } from 'calculator'
+  
+@customElement('demo-total')
+class Total extends LitElement {
+
+  @sub({ update: function (calc: Calculator) { calc.onChange(() => { this.requestUpdate() }) } })
+  calc: Calculator
+
+  render() {
+    return html`
+    <input 
+      type="number" 
+      value="${this.calc.total()}" 
+      readonly>
+    </input>`
+  }
+}
+```
+
+## HTML
+
+Here the components are combined. The `demo-val` elements find the calculator service because they have an ancestor, demo-calculator that provides the service.
+
+```html
+  <demo-calculator>
+    <demo-val id="1"></demo-val>
+    +
+    <demo-val id="2"></demo-val>
+    +
+    <demo-val id="3"></demo-val>
+    =
+    <demo-total></demo-total>
+  </demo-calculator>
+```
diff --git a/README.md b/README.md
index d585b1f..e789d95 100644
--- a/README.md
+++ b/README.md
@@ -2,21 +2,23 @@
 
 ***NOTE: This library is experimental!***
 
-Bubblesub is a simple library to create observables. It leverages the DOM and DOM events to reduce coupling to make things simple and lightweight. 
+Bubblesub is a simple and lightweight library to manage observables. It builds on top of the DOM and event web standards. It's reduces the code needed without introducing a large library. It targets mid-range problems such as:
+* building web components libraries
+* micro frontends
+* create observable contexts that are neither bound to a whole app or to a whole page.  
 
-With it, you can easily implement the following:
-* dependency injection
-* state management
-* data streaming
+Bubblesub is flexible enough to accomplish different types of integrations:
+* share a singleton services or factory
+* share data
+* stream data from a websocket or SSE to multiple listening components
+
+Bubblesub is written in Typescript but useable as a JS or TS dependency. It is published using ES 6 modules
 
 Bubblesub is inspired by a conference talk given by Justin Fagnani (@justinfugnani) who works on Polymer's lit-element and lit-html: [Polymer - Dependency Injection](https://youtu.be/6o5zaKHedTE)
 
 ## It's Easy
 
-Here is an example on StackBlitz that integrates with [lit-element](https://lit-element.polymer-project.org/) :
-[StackBlitz Example](https://stackblitz.com/edit/bubblesub-demo) 
-
-There are some other examples in this repo that are implemented as standalone Web Components. Finde them [here](src/example).
+There are some examples in this repo that are implemented as standalone Web Components. Finde them [here](src/example).
 
 ## How it works
 
@@ -26,93 +28,74 @@ There are some other examples in this repo that are implemented as standalone We
 * Bubblesub is written in Typescript and is provided with ES module bundling and d.ts files
 * Bubblesub has zero dependencies and targets web component (ie: custom elements, shadow dom) development. 
 
-### Publishing
-
-Here is an example of a higher-level component that publishes a calculator as a service. 
+### Publishing a Stream of updates
 
+Do the following to publish a stream of data or update a single value as it changes 
+ 
+#### publishing
 ```typescript
-import { LitElement, customElement, html } from 'lit-element'
-import { pub } from 'bubblesub'
-import { Calculator } from 'calculator'
-
-//Parent calculator component
-@customElement('demo-calculator')
-class App extends LitElement {
+import { Publication } from './publication' 
+import { publish } from './publish'
 
-  @pub()
-  calc: Calculator = new Calculator()
+interface Price { name: string, price: number }
+ 
+const pub: Publication<Price> = publish(document.body).create<Price>('prices')
+pub.update({name: 'goog', price: 1273.74})
+pub.update({name: 'fb', price: 193.62})
 
-  render() {
-    return html`<h1>Calculator</h1><slot></slot>`;
-  }
-}
+pub.close()
 
 ```
 
-### Subscribing
-
-Here is a child element that can be repeated as many times as is needed.
+#### subscribing
 
+You can subscribe for all updates, just the first, or just the last. The last update is only published if the publication is closed.
 ```typescript
-import { LitElement, customElement, html } from 'lit-element'
-import { sub } from 'bubblesub'
-import { Calculator } from 'calculator'
-
-@customElement('demo-val')
-class Value extends LitElement {
+import { subscribe } from './subscribe' 
 
-  @sub()
-  calc: Calculator
+interface Price { name: string, price: number }
 
-  render() {
-    return html`
-    <input 
-      type="number" 
-      @change="${(e) => { this.calc.set(parseInt(this.id), parseInt(e.target.value)) }}" >
-    </input>`
-  }
-}
+subscribe(this)
+      .to<Price>('prices')
+      .map((price: Price) => { /*do something with all the price*/})
+      .mapFirst((price: Price) => { /*do something with the initial price*/})
+      .mapLast((price: Price) => { /*do something with the final price*/})
 
 ```
 
-Here is a child element that displays the total of the calculation
+### Publishing a service
+           
+Publishing a service or a factory is very similar to a stream of values. It's simply not expected that a service or factory is updated more than once.  
+
+#### publishing
+
+To publish a shared service or factory do the same as with a stream.   
 
 ```typescript
-import { LitElement, customElement, html } from 'lit-element'
-import { sub } from 'bubblesub'
-import { Calculator } from 'calculator'
-  
-@customElement('demo-total')
-class Total extends LitElement {
-
-  @sub({ update: function (calc: Calculator) { calc.onChange(() => { this.requestUpdate() }) } })
-  calc: Calculator
-
-  render() {
-    return html`
-    <input 
-      type="number" 
-      value="${this.calc.total()}" 
-      readonly>
-    </input>`
-  }
-}
+import {ServiceImpl, ServiceInterface } from 'my-app' 
+import { publish } from 'bubblesub' 
+
+const pub = publish(document.body).create<ServiceInterface>('service')
+pub.update(new ServiceImpl())
+
 ```
 
-### HTML
+#### subscribing
+
+To subscribe to a service or factory use async/await with the `.toPromise()` function to resolve the first update. Or you can use the `.mapFirst()` to process the update in a callback.
+
+```typescript
+import { subscribe } from 'bubblesub' 
+import { ServiceInterface } from 'my-app' 
 
-Here the components are combined. The `demo-val` elements find the calculator service because they have an ancestor, demo-calculator that provides the service.
+const service:ServiceInterface = await subscribe(this)
+      .to<ServiceInterface>('service')
+      .toPromise()
 
-```html
-  <demo-calculator>
-    <demo-val id="1"></demo-val>
-    +
-    <demo-val id="2"></demo-val>
-    +
-    <demo-val id="3"></demo-val>
-    =
-    <demo-total></demo-total>
-  </demo-calculator>
+subscribe(this)
+      .to<ServiceInterface>('service')
+      .mapFirst((service:ServiceInterface)=>{/* do something with the service*/})
+      
 ```
 
 ## Leveraging the DOM and events
@@ -124,7 +107,11 @@ So...
 * Bubblesub requires that the publisher of a Publication be an ancestor of the subscriber
 * Bubblesub relies on the hierarchical nature of the DOM to bind publisher and subscriber. A subscriber is bound to the closest ancestor that publishes the wanted Publication. 
 * There is no central registry of Publications. This means that your Bubblesub bindings can be encapsulated within a parent component, leak nothing, require nothing from outside.
- 
+* bubblesub does not require that subscribing happen after an observable is published. The subcriber will keep on trying to find the observable assuming it will eventually appear. On the other hand a late subscriber will receive all the updates that the observable has accumulated before the subscription was established.   
+
+## Decorators
+
+see: [experimental decorators](DECORATORS.md)
 
 ## Usage
 
@@ -135,9 +122,13 @@ The only required coupling is on the name of the dependency. Bubblesub is implem
 A set of examples devised for demonstrating and testing is available if you checkout the project and build it. For the sake of clarity the examples are implemented using vanilla JS web components.
 
 ```shell script
-yarn build.example
+## build the library, the tests, and the examples
+yarn build:serve
+
+## serve the built examples
 yarn serve
-## open browser at http://localhost:8080
+
+## open browser at http://localhost:8888
 ```
 
 [Docs on Examples](src/example/README.md)
diff --git a/package.json b/package.json
index 70b84e4..c65fa23 100644
--- a/package.json
+++ b/package.json
@@ -1,52 +1,52 @@
 {
-    "name": "bubblesub",
-    "version": "1.2.0",
-    "description": "Observables based on DOM events",
-    "repository": "https://github.com/zenwork/bubblesub.git",
-    "author": "Florian Hehlen <florian@hehlen.name>",
-    "license": "MIT",
-    "keywords": [
+    "name"           : "bubblesub",
+    "version"        : "1.2.0",
+    "description"    : "Observables based on DOM events",
+    "repository"     : "https://github.com/zenwork/bubblesub.git",
+    "author"         : "Florian Hehlen <florian@hehlen.name>",
+    "license"        : "MIT",
+    "keywords"       : [
         "typescript",
         "DI",
         "publisher",
         "subscriber",
         "event"
     ],
-    "scripts": {
-        "build": "pika build",
-        "build:serve": "npm run build && mkdir -p .serve/node_modules && rsync -cavzur pkg/ .serve/  > /dev/null 2>&1 && rsync -cavzur ./node_modules/lit-html .serve/node_modules  > /dev/null 2>&1 && rsync -cavzur ./node_modules/lit-element .serve/node_modules  > /dev/null 2>&1 ",
-        "build:watch": "watch \"npm run build:serve\" ./src ./assets",
-        "lint": "tslint -c tslint.json 'src/**/*.ts'",
-        "minify": "terser --source-map includeSources pkg/dist-web/index.js -o pkg/dist-web/index.min.js; terser --source-map includeSources pkg/dist-web/index.bundled.js -o pkg/dist-web/index.bundled.min.js",
-        "prepare": "npm run build:serve; npm run lint",
-        "serve": "es-dev-server --config es-dev-server.config.js --root-dir .serve",
-        "test": "npm run test:headless",
+    "scripts"        : {
+        "build"        : "pika build",
+        "build:serve"  : "npm run build && mkdir -p .serve/node_modules && rsync -cavzur pkg/ .serve/  > /dev/null 2>&1 && rsync -cavzur ./node_modules/lit-html .serve/node_modules  > /dev/null 2>&1 && rsync -cavzur ./node_modules/lit-element .serve/node_modules  > /dev/null 2>&1 ",
+        "build:watch"  : "watch \"npm run build:serve\" ./src ./assets",
+        "lint"         : "tslint -c tslint.json 'src/**/*.ts'",
+        "minify"       : "terser --source-map includeSources pkg/dist-web/index.js -o pkg/dist-web/index.min.js; terser --source-map includeSources pkg/dist-web/index.bundled.js -o pkg/dist-web/index.bundled.min.js",
+        "prepare"      : "npm run build:serve; npm run lint",
+        "serve"        : "es-dev-server --config es-dev-server.config.js --root-dir .serve",
+        "test"         : "npm run test:headless",
         "test:headless": "mocha-headless-chrome -f http://localhost:8888/assets/test-bundled.html",
-        "test:watch": "watch \"npm run build:serve && npm run test:headless\" ./src ./assets",
-        "version": "npm run build"
+        "test:watch"   : "watch \"npm run build:serve && npm run test:headless\" ./src ./assets",
+        "version"      : "npm run build"
     },
     "devDependencies": {
-        "@pika/pack": "^0.5.0",
-        "@pika/plugin-build-node": "^0.6.1",
-        "@pika/plugin-build-web": "^0.6.1",
-        "@pika/plugin-bundle-web": "^0.6.1",
-        "@pika/plugin-copy-assets": "^0.6.1",
+        "@pika/pack"                  : "^0.5.0",
+        "@pika/plugin-build-node"     : "^0.6.1",
+        "@pika/plugin-build-web"      : "^0.6.1",
+        "@pika/plugin-bundle-web"     : "^0.6.1",
+        "@pika/plugin-copy-assets"    : "^0.6.1",
         "@pika/plugin-ts-standard-pkg": "^0.6.1",
-        "@pika/web": "^0.6.1",
-        "@types/chai": "^4.2.3",
-        "@types/mocha": "^5.2.7",
-        "chai": "^4.2.0",
-        "es-dev-server": "^1.18.4",
-        "lit-element": "^2.2.1",
-        "lit-html": "^1.1.2",
-        "mocha": "^6.2.1",
-        "mocha-headless-chrome": "^2.0.3",
-        "terser": "^4.3.9",
-        "tslint": "^5.20.0",
-        "typescript": "^3.6.4",
-        "watch": "^1.0.2"
+        "@pika/web"                   : "^0.6.1",
+        "@types/chai"                 : "^4.2.3",
+        "@types/mocha"                : "^5.2.7",
+        "chai"                        : "^4.2.0",
+        "es-dev-server"               : "^1.18.4",
+        "lit-element"                 : "^2.2.1",
+        "lit-html"                    : "^1.1.2",
+        "mocha"                       : "^6.2.1",
+        "mocha-headless-chrome"       : "^2.0.3",
+        "terser"                      : "^4.3.9",
+        "tslint"                      : "^5.20.0",
+        "typescript"                  : "^3.6.4",
+        "watch"                       : "^1.0.2"
     },
-    "@pika/pack": {
+    "@pika/pack"     : {
         "pipeline": [
             [
                 "@pika/plugin-ts-standard-pkg"
diff --git a/src/decorators.ts b/src/decorators.ts
index 48c4746..db1e442 100644
--- a/src/decorators.ts
+++ b/src/decorators.ts
@@ -1,5 +1,6 @@
-import { Publication, publisher } from './publisher.js'
-import { subscriber, Update } from './subscriber.js'
+import { Publication } from './publication'
+import { publish } from './publish.js'
+import { subscribe, Update } from './subscribe.js'
 
 export class SubConfig<T> {
   name?: string | undefined
@@ -32,7 +33,7 @@ export function sub<T>(config: SubConfig<T> = {}) {
           } else {
             up = (v: any) => value = v
           }
-          if (conf.name != null) {subscriber(this).request<T>(conf.name, up)}
+          if (conf.name != null) {subscribe(this).to<T>(conf.name).map(up)}
           subscribed = true
         }
         if (isGet) {
@@ -73,9 +74,9 @@ export function pub<T>(config: PubConfig<T> = {}) {
 
         if (!publication) {
           if (conf.pubTarget) {
-            publication = publisher(conf.pubTarget).create<T>(conf.name, conf.initialValue)
+            publication = publish(conf.pubTarget).create<T>(conf.name, conf.initialValue)
           } else {
-            publication = publisher(this).create<T>(conf.name, conf.initialValue)
+            publication = publish(this).create<T>(conf.name, conf.initialValue)
           }
         }
 
diff --git a/src/example/di/CounterView.ts b/src/example/di/CounterView.ts
index 42b0ec8..353a77a 100644
--- a/src/example/di/CounterView.ts
+++ b/src/example/di/CounterView.ts
@@ -1,6 +1,5 @@
 import { customElement, html, LitElement, property } from 'lit-element'
-import { sub } from '../../decorators.js'
-import { subscriber } from '../../subscriber.js'
+import { subscribe } from '../../subscribe.js'
 import { SequenceService } from './index.js'
 
 @customElement('counter-view')
@@ -9,12 +8,19 @@ export class CounterView extends LitElement {
   @property({attribute: false})
   private counter: number = 0
 
-  @sub({name: 'service.counter'})
+  @property({attribute: false})
   private service: SequenceService
 
+  async connectedCallback() {
+    super.connectedCallback()
+    this.service = await subscribe(this)
+      .to<SequenceService>('service.counter')
+      .toPromise()
+  }
+
   protected render() {
     return html`
-            <input type="button" value="+" id="button" @click="${this.increment}"/>
+            <input type="button" value="+" id="button" @click="${this.increment}" />
             <h2>Next Fibonacci: <span id="value">${this.counter}</span></h2>`
   }
 
diff --git a/src/example/di/index.test.ts b/src/example/di/index.test.ts
index c6d609d..c9f079f 100644
--- a/src/example/di/index.test.ts
+++ b/src/example/di/index.test.ts
@@ -1,10 +1,10 @@
-import { initLit, Query } from '../util.js'
+import { initLit, Query } from '../test-util.js'
 import { CounterService, CounterView } from './index.js'
 
 describe('fibonacci counter(di) example', () => {
 
   describe('service', () => {
-    it('should increment the sequence when next() called', async () => {
+    it('should increment the sequence when next() called', async function() {
       const counterService = new CounterService()
       chai.expect(counterService.next()).to.equal(1)
       chai.expect(counterService.next()).to.equal(1)
@@ -14,16 +14,16 @@ describe('fibonacci counter(di) example', () => {
     })
   })
 
-  describe('wc', () => {
+  describe('wc', function() {
     let wc: CounterView
     let value: Query
     let button: Query
     let wrapper: any
 
-    beforeEach(async () => {
+    beforeEach(async function() {
       wc = await initLit('counter-view', '#container')
       value = new Query(wc, 'span')
-      button = new Query(wc, 'input')
+      button = new Query(wc, '#button')
       wrapper = {
           wc,
           value: async () => {
@@ -38,28 +38,32 @@ describe('fibonacci counter(di) example', () => {
             return await wc.updateComplete
           }
         }
+      return wc.updateComplete
     })
 
-    it('should show next number when button pressed', async () => {
-      await wrapper.await()
-      chai.expect(value.query().textContent).to.equal('0')
-      await button.query().click()
-      await wc.updateComplete
-      chai.expect(value.query().textContent).to.equal('1')
-      await wrapper.button()
-      chai.expect(value.query().textContent).to.equal('1')
-      await wrapper.button()
-      chai.expect(value.query().textContent).to.equal('2')
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      await wrapper.button()
-      chai.expect(value.query().textContent).to.equal('89')
-    })
+    setTimeout(() => {
+
+      it('should show next number when button pressed', async function() {
+        await this.timeout(1000)
+        await wrapper.await()
+        chai.expect(value.query().textContent).to.equal('0')
+        await wrapper.button()
+        chai.expect(value.query().textContent).to.equal('1')
+        await wrapper.button()
+        chai.expect(value.query().textContent).to.equal('1')
+        await wrapper.button()
+        chai.expect(value.query().textContent).to.equal('2')
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        await wrapper.button()
+        chai.expect(value.query().textContent).to.equal('89')
+      })
+    }, 500)
 
   })
 })
diff --git a/src/example/di/index.ts b/src/example/di/index.ts
index 1d38a25..2e01938 100644
--- a/src/example/di/index.ts
+++ b/src/example/di/index.ts
@@ -1,5 +1,4 @@
-import { publisher } from '../../publisher.js'
-
+import { publish } from '../../publish.js'
 export { CounterView } from './CounterView.js'
 
 export interface SequenceService {
@@ -34,4 +33,5 @@ function* fib() {
   }
 }
 
-publisher(document.body).create('service.counter', new CounterService())
+const pub = publish(document.body).create<SequenceService>('service.counter')
+pub.update(new CounterService())
diff --git a/src/example/index.test.ts b/src/example/index.test.ts
index 7e99288..2deb80b 100644
--- a/src/example/index.test.ts
+++ b/src/example/index.test.ts
@@ -1,2 +1,3 @@
 import './di/index.test.js'
 import './service/index.test.js'
+import './streaming/index.test.js'
diff --git a/src/example/progress/ProgressBar.ts b/src/example/progress/ProgressBar.ts
index 8099941..fb5cd60 100644
--- a/src/example/progress/ProgressBar.ts
+++ b/src/example/progress/ProgressBar.ts
@@ -1,13 +1,13 @@
-import { subscriber } from '../../subscriber.js'
+import { subscribe } from '../../subscribe.js'
 
 export class ProgressBar extends HTMLElement {
   factor = Math.random() * 2
   f = (this.factor > 2) ? 1 : this.factor
 
   connectedCallback(): void {
-    subscriber(this)
-      .request(
-        'percent',
+    subscribe(this)
+      .to<number>('percent')
+      .map(
         (percent: number) => {
           let calc = percent * this.f
 
diff --git a/src/example/progress/ProgressDialog.ts b/src/example/progress/ProgressDialog.ts
index 795b93e..4a7ecac 100644
--- a/src/example/progress/ProgressDialog.ts
+++ b/src/example/progress/ProgressDialog.ts
@@ -1,5 +1,6 @@
-import { Publication, publisher } from '../../publisher.js'
-import { subscriber } from '../../subscriber.js'
+import { Publication } from '../../publication'
+import { publish } from '../../publish.js'
+import { subscribe } from '../../subscribe.js'
 import { FileService } from './FileService.js'
 
 export class ProgressDialog extends HTMLElement {
@@ -10,7 +11,7 @@ export class ProgressDialog extends HTMLElement {
   constructor() {
     super()
     this.root = this.attachShadow({mode: 'open'})
-    this.pub = publisher(this.root).create('percent', 0)
+    this.pub = publish(this.root).create('percent', 0)
 
     this.root.innerHTML = `
        <h1>CHUNK DOWNLOAD</h1>
@@ -23,9 +24,9 @@ export class ProgressDialog extends HTMLElement {
 
   connectedCallback() {
 
-    subscriber(this).request(
-      'file-service',
-      (srv: FileService) => {
+    subscribe(this)
+      .to<FileService>('file-service')
+      .map((srv: FileService) => {
 
         // set file name and size
         this.root.querySelector('.name').innerHTML = srv.getName()
diff --git a/src/example/progress/index.ts b/src/example/progress/index.ts
index f4489ca..fc07ce0 100644
--- a/src/example/progress/index.ts
+++ b/src/example/progress/index.ts
@@ -1,4 +1,4 @@
-import { publisher } from '../../publisher.js'
+import { publish } from '../../publish.js'
 import { service } from './FileService.js'
 export { ProgressDialog } from './ProgressDialog.js'
 export { ProgressBar } from './ProgressBar.js'
@@ -7,7 +7,7 @@ export class FileServiceComponent extends HTMLElement {
 
   constructor() {
     super()
-    publisher(document.body).create('file-service', service)
+    publish(document.body).create('file-service', service)
 
   }
 }
diff --git a/src/example/service/index.test.ts b/src/example/service/index.test.ts
index 5146315..edb0e1e 100644
--- a/src/example/service/index.test.ts
+++ b/src/example/service/index.test.ts
@@ -3,7 +3,7 @@ import { Todo, TodoService } from './service.js'
 describe('todo example', () => {
   describe('service', () => {
 
-    it('listens to selected', (done) => {
+    it('listens to selected', function(done) {
 
       const service = new TodoService()
       service.add({summary: 'project', details: 'finish project', status: {done: false, due: null}})
@@ -18,7 +18,7 @@ describe('todo example', () => {
 
   })
 
-    it('indexes are maintained', () => {
+    it('indexes are maintained', function() {
 
       const service = new TodoService()
       service.add({summary: 'project', details: 'finish project', status: {done: false, due: null}})
@@ -33,7 +33,7 @@ describe('todo example', () => {
       chai.expect(todo.summary).to.equal('supper')
   })
 
-    it('gets all todoList', () => {
+    it('gets all todoList', function() {
       const service = new TodoService()
       service.add({summary: 'project', details: 'finish project', status: {done: false, due: null}})
       service.add({summary: 'supper', details: 'make green curry', status: {done: false, due: null}})
diff --git a/src/example/streaming/PriceSource.ts b/src/example/streaming/PriceSource.ts
new file mode 100644
index 0000000..68de2af
--- /dev/null
+++ b/src/example/streaming/PriceSource.ts
@@ -0,0 +1,78 @@
+// random integer generator
+import { pub } from '../../decorators.js'
+import { Publication } from '../../publication'
+import { publish } from '../../publish.js'
+import { subscribe } from '../../subscribe'
+import doc = Mocha.reporters.doc
+
+function getRandomInt(x: number, y: number) {
+  return Math.floor(Math.random() * ((y - x) + 1) + x)
+}
+
+// Start price streams
+export class PriceSource {
+
+  closed: boolean = false
+  counter: number = 0
+  publication: Publication<{ name: string, price: number }>
+
+  constructor(prices?: Array<{ price: number; name: string } | { price: number; name: string }>,
+              interval?: number) {
+    this.publication = publish(document.body).create<{ price: number; name: string }>('prices')
+
+    if (!prices) {
+      this.updatePrice('apples', interval)
+      this.updatePrice('bananas', interval)
+      this.updatePrice('grapes', interval)
+      this.updatePrice('kiwi', interval)
+      this.updatePrice('oranges', interval)
+    } else {
+
+      setTimeout(() => {
+        prices.forEach((p) => {this.publication.update(p)})
+        this.publication.close()
+      }, 0)
+    }
+
+    this.checkDone()
+  }
+
+  updatePrice(name: string, interval?: number) {
+    interval = interval || getRandomInt(200, 1000)
+    console.debug(`NEW publishing prices for ${name} every ${interval} millis`)
+    this.generator(30, interval,
+      value => {
+        this.publication.update({name, price: value})
+      })
+  }
+
+  close() {
+    this.closed = true
+    this.publication.close()
+  }
+
+  private checkDone() {
+    setTimeout(() => {
+
+      if (this.counter === 150) this.close()
+      this.checkDone()
+    }, 100)
+  }
+
+  // random price stream generator
+  private generator(size: number, speed: number, callback: (value: number) => void) {
+    this.getNextPrice(size, speed, callback)
+  }
+
+  private getNextPrice(remaining: number, speed: number, callback: (value: number) => void) {
+    if (!this.closed) {
+      remaining = remaining - 1
+      setTimeout(() => {
+        const value = getRandomInt(0, 1000)
+        callback(value)
+        this.counter++
+        if (remaining > 0) this.getNextPrice(remaining, speed, callback)
+      }, speed)
+    }
+  }
+}
diff --git a/src/example/streaming/Ticker.ts b/src/example/streaming/Ticker.ts
index b09fd1f..d443847 100644
--- a/src/example/streaming/Ticker.ts
+++ b/src/example/streaming/Ticker.ts
@@ -1,44 +1,82 @@
-import { sub } from '../../decorators.js'
+import { customElement, html, LitElement, property } from 'lit-element'
+import { subscribe } from '../../subscribe.js'
 
-export class Ticker extends HTMLElement {
+interface Tick {
+  name: string,
+  price: number
+}
 
-  @sub({update(change) { this.updateOnChange(change)}})
-  priceStream: { name: string, price: number } | null
+@customElement('ex-ticker')
+export class Ticker extends LitElement {
 
-  lastPrice: number
+  @property()
+  applePrices: number[]
 
-  connectedCallback() {
-    this.innerHTML = `
-        <ul class="prices"></ul>
-        <h2 class="change">apple price change: </h2>
-    `
-    this.priceStream
-  }
+  @property()
+  prices: Tick[]
+
+  @property()
+  first: Tick
+
+  @property()
+  last: Tick
+
+  @property()
+  counter: number
+
+  constructor() {
+    super()
+    this.prices = new Array<Tick>()
+    this.applePrices = new Array<number>()
+    this.counter = 0
+
+    subscribe(this)
+      .to<Tick>('prices')
+      .map((tick: Tick) => {
+        this.counter++
+        if (this.prices.filter((t: Tick) => t.name === tick.name).length === 1) {
+          this.prices
+            .map((t: Tick) => {
+              if (t.name === tick.name) t.price = tick.price
+              return t
+            })
+        } else {
+          this.prices.push(this.copy(tick))
+        }
+
+        if (tick.name === 'apples') this.applePrices.push(tick.price)
+        this.requestUpdate()
+
+      })
+      .mapFirst((first: Tick) => {
+        this.first = this.copy(first)
+      })
+      .mapLast((last: Tick) => {
+        this.last = this.copy(last)
+      })
 
-  updateOnChange(change: { name: string, price: number }) {
-    this.updatePrice(change)
-    this.updateApplePriceChange(change)
   }
 
-  private updateApplePriceChange(change: { name: string; price: number }) {
-    if (change.name === 'apples') {
-      this.querySelector('.change').innerHTML = `apple price change: ${change.price - this.lastPrice}`
-      this.lastPrice = change.price
-    }
+  render() {
+    return html`
+        <h1>prices</h1>
+        <ul id="prices">
+            ${this.prices.map((t: Tick) => html`<li id="${t.name}">${t.name}:${t.price}</li>`)}
+        </ul>
+        <h2>first price was</h2>
+        <ul>
+            <li id="first">${this.first ? this.first.name : ''}:${this.first ? this.first.price : ''}</li>
+        </ul>
+        <h2>last price was</h2>
+        <ul>
+            <li id="last">${this.last ? this.last.name : ''}:${this.last ? this.last.price : ''}</li>
+        </ul>
+        <h2 class="change">apple price change: ${this.applePrices[this.applePrices.length - 1] - this.applePrices[this.applePrices.length - 2]}</h2>
+        <h2 class="change">counter: ${this.counter}</h2>
+    `
   }
 
-  private updatePrice(change: { name: string; price: number }) {
-    const element = this.querySelector('.' + change.name)
-    const template = `${change.name}: ${change.price}`
-    if (element) {
-      element.innerHTML = template
-    } else {
-      const item = document.createElement('li')
-      item.className = change.name
-      item.innerHTML = `${change.name}: ${change.price}`
-      this.querySelector('.prices').appendChild(item)
-    }
+  private copy(last: Tick) {
+    return JSON.parse(JSON.stringify(last))
   }
 }
-
-customElements.define('ex-ticker', Ticker)
diff --git a/src/example/streaming/index.test.ts b/src/example/streaming/index.test.ts
new file mode 100644
index 0000000..c679be0
--- /dev/null
+++ b/src/example/streaming/index.test.ts
@@ -0,0 +1,66 @@
+import { initLit, Query } from '../test-util.js'
+import { PriceSource } from './PriceSource.js'
+import { Ticker } from './Ticker.js'
+export { Ticker } from './Ticker.js'
+
+describe('streaming', function() {
+  // @ts-ignore
+  this.timeout(5000)
+  this.enableTimeouts()
+
+  describe('wc', function() {
+    let service: PriceSource
+    let wc: Ticker
+    let first: Query
+    let last: Query
+    let apples: Query
+
+    beforeEach(async function() {
+      wc = await initLit('ex-ticker', '#container')
+      await wc.updateComplete
+      first = new Query(wc, '#first')
+      last = new Query(wc, '#last')
+      apples = new Query(wc, '#prices > #apples')
+    })
+
+    afterEach(async function() {
+      service.close()
+      service = null
+    })
+
+    it('1- should get exactly first when subscribing to first', function(done) {
+      service = new PriceSource([{name: 'apples', price: 999}, {name: 'apples', price: 888}])
+      setTimeout(() => {
+        const value = first.query().innerText
+        chai.expect(value).to.equal('apples:999')
+        done()
+      }, 300)
+
+    })
+
+    it('2- should not miss first when subscribing to all', function(done) {
+      service = new PriceSource([{name: 'apples', price: 999}])
+      setTimeout(() => {
+        const value = apples.query().innerText
+        chai.expect(value).to.equal('apples:999')
+        done()
+      }, 300)
+
+    })
+
+    it('2- should not miss last when subscribing to last', function(done) {
+      service = new PriceSource([
+        {name: 'apples', price: 999},
+        {name: 'apples', price: 888},
+        {name: 'apples', price: 777}
+      ])
+      setTimeout(() => {
+        const value = last.query().innerText
+        chai.expect(value).to.equal('apples:777')
+        done()
+      }, 300)
+
+    })
+
+  })
+})
diff --git a/src/example/streaming/index.ts b/src/example/streaming/index.ts
index 14b4ce7..e8b44e4 100644
--- a/src/example/streaming/index.ts
+++ b/src/example/streaming/index.ts
@@ -1,56 +1,4 @@
-import { pub } from '../../decorators.js'
-
+import { PriceSource } from './PriceSource.js'
 export { Ticker } from './Ticker.js'
 
-// random integer generator
-function getRandomInt(x: number, y: number) {
-  return Math.floor(Math.random() * ((y - x) + 1) + x)
-}
-
-// random price stream generator
-function generator(size: number, speed: number, callback: (value: number) => void) {
-  const x = 0
-  const y = 1000
-
-  function getPrice(remaining: number) {
-    remaining = remaining - 1
-    setTimeout(() => {
-      const value = getRandomInt(x, y)
-      callback(value)
-      if (remaining > 0) getPrice(remaining)
-    }, speed)
-  }
-
-  getPrice(size)
-
-}
-
-export const config = {initialValue: 0, pubTarget: document.body}
-
-// Start price streams
-export class PriceStreamer {
-
-  @pub({initialValue: null, pubTarget: document.body})
-  priceStream: { name: string, price: number }
-
-  constructor() {
-    this.updatePrice('apples')
-    this.updatePrice('bananas')
-    this.updatePrice('grapes')
-    this.updatePrice('kiwi')
-    this.updatePrice('oranges')
-  }
-
-  updatePrice(name: string) {
-    const speed = getRandomInt(200, 1000)
-    console.debug(`NEW publishing prices for ${name} every ${speed} millis`)
-    generator(300, speed,
-      value => {
-        // this[name] = value
-        this.priceStream = {name, price: value}
-      })
-  }
-
-}
-
-new PriceStreamer()
+new PriceSource()
diff --git a/src/example/streaming/util.ts b/src/example/streaming/util.ts
deleted file mode 100644
index 1f2b867..0000000
--- a/src/example/streaming/util.ts
+++ /dev/null
@@ -1,29 +0,0 @@
-/**
- * Watch for changes. In a real app this is expected to be provided by a library such as LitElement
- * @param name
- * @param wc
- */
-export function updateOnChange(name: string, wc: HTMLElement) {
-  // @ts-ignore
-  let current = wc[name]
-  setTimeout(() => {
-    // @ts-ignore
-    if (current !== wc[name]) {
-      const element = wc.querySelector('.' + name)
-      // @ts-ignore
-      const template = `${name}: ${wc[name]}`
-      if (element) {
-        element.innerHTML = template
-      } else {
-        const item = document.createElement('li')
-        item.className = name
-        // @ts-ignore
-        item.innerHTML = `${name}: ${wc[name]}`
-        wc.querySelector('.prices').appendChild(item)
-      }
-      // @ts-ignore
-      current = wc[name]
-    }
-    updateOnChange(name, wc)
-  }, 5)
-}
diff --git a/src/example/util.ts b/src/example/test-util.ts
similarity index 100%
rename from src/example/util.ts
rename to src/example/test-util.ts
diff --git a/src/index.test.ts b/src/index.test.ts
index e32c986..8c825c0 100644
--- a/src/index.test.ts
+++ b/src/index.test.ts
@@ -1 +1,3 @@
 import './example/index.test.js'
+import './publication.test.js'
+import './subscriber.test.js'
diff --git a/src/index.ts b/src/index.ts
index 52ccaf9..b7bfefb 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,3 +1,11 @@
-export { publisher, Publication } from './publisher.js'
-export { subscriber, PublicationRequest, PUB_REQUEST_EVENT_NAME } from './subscriber.js'
+import { publish } from './publish'
+export { publish } from './publish.js'
+export { subscribe } from './subscribe.js'
 export * from './decorators'
+export { PublicationRequest } from './publication.js'
+export { Publication } from './publication.js'
+
+/**
+ * The general purpose custom event name visible on the DOM used in bubblesub
+ */
+export const PUB_REQUEST_EVENT_NAME: string = 'bubblesubpublicationrequest'
diff --git a/src/publication.test.ts b/src/publication.test.ts
new file mode 100644
index 0000000..6c73831
--- /dev/null
+++ b/src/publication.test.ts
@@ -0,0 +1,100 @@
+import { Publication } from './publication.js'
+
+describe('publisher', function() {
+  this.enableTimeouts()
+  const expect = chai.expect
+
+  describe('Publication', function() {
+
+    it('should be empty after init', function() {
+      const pub = new Publication('test')
+
+      expect(pub.value).to.be.null
+      expect(pub.first).to.be.null
+      expect(pub.last).to.be.null
+      expect(pub.length).to.equal(0)
+
+    })
+
+    it('should contain one item after initializing with default', function() {
+      const pub = new Publication<number>('test', 999)
+
+      expect(pub.value).to.equal(999)
+      expect(pub.first).to.equal(999)
+      expect(pub.last).to.be.equal(999)
+      expect(pub.length).to.equal(1)
+
+    })
+
+    it('should contain two item after initializing with one default and one update', function() {
+      const pub = new Publication<number>('test', 999)
+      pub.update(888)
+
+      expect(pub.value).to.equal(888)
+      expect(pub.first).to.equal(999)
+      expect(pub.last).to.be.equal(888)
+      expect(pub.length).to.equal(2)
+
+    })
+
+    it('should contain three item after initializing with three items', function() {
+      const pub = new Publication<number>('test')
+      pub.update(999)
+      pub.update(888)
+      pub.update(777)
+
+      expect(pub.value).to.equal(777)
+      expect(pub.first).to.equal(999)
+      expect(pub.last).to.be.equal(777)
+      expect(pub.length).to.equal(3)
+    })
+
+    it('should trigger early subscriptions', function() {
+      let subAll: number
+      let subFirst: number
+      let subLast: number
+
+      const pub = new Publication<number>('test')
+
+      pub.subscribe((update: number) => {subAll = update})
+      pub.subscribeForFirst((update: number) => {subFirst = update})
+      pub.subscribeForLast((update: number) => {subLast = update})
+
+      pub.update(999)
+      pub.update(888)
+      expect(subAll).to.equal(888)
+      expect(subLast).to.equal(undefined)
+      pub.update(777)
+
+      pub.close()
+      expect(subAll).to.equal(777)
+      expect(subFirst).to.equal(999)
+      expect(subLast).to.equal(777)
+
+    })
+
+    it('should trigger late subscriptions', function(done) {
+      let subAll: number
+      let subFirst: number
+      let subLast: number
+
+      const pub = new Publication<number>('test')
+
+      pub.update(999)
+      pub.update(888)
+      pub.update(777)
+      pub.close()
+
+      pub.subscribe((update: number) => {subAll = update})
+      pub.subscribeForFirst((update: number) => {subFirst = update})
+      pub.subscribeForLast((update: number) => {subLast = update})
+
+      setTimeout(() => {
+        expect(subAll).to.equal(777)
+        expect(subFirst).to.equal(999)
+        expect(subLast).to.equal(777)
+        done()
+      }, 200)
+    })
+  })
+})
diff --git a/src/publication.ts b/src/publication.ts
new file mode 100644
index 0000000..ef5ab25
--- /dev/null
+++ b/src/publication.ts
@@ -0,0 +1,142 @@
+import { Update } from './subscribe'
+
+/**
+ * Request for publication to subscribe to
+ */
+export class PublicationRequest<T> {
+  readonly name: string
+  private internalPublication?: Publication<T>
+  private subscriptions = new Array<Update<T>>()
+  private firstSubscriptions = new Array<Update<T>>()
+  private lastSubscriptions = new Array<Update<T>>()
+
+  constructor(name: string) {
+    this.name = name
+  }
+
+  get value(): T | null | undefined {
+    return this.pub ? this.pub.value : null
+  }
+
+  get pub() {return this.internalPublication}
+
+  set pub(pub: Publication<T>) {
+    if (!this.internalPublication) {
+      this.subscriptions.forEach((u) => pub.subscribe(u))
+      this.subscriptions.length = 0
+
+      this.firstSubscriptions.forEach((u) => pub.subscribeForFirst(u))
+      this.firstSubscriptions.length = 0
+
+      this.lastSubscriptions.forEach((u) => pub.subscribeForLast(u))
+      this.lastSubscriptions.length = 0
+    }
+
+    this.internalPublication = pub
+  }
+
+  subscribe(update: Update<T>) {
+    if (this.pub) {
+      this.pub.subscribe(update)
+    } else {
+      this.subscriptions.push(update)
+    }
+  }
+
+  subscribeForFirst(fn: Update<T>) {
+    if (this.pub) {
+      this.pub.subscribeForFirst(fn)
+    } else {
+      this.lastSubscriptions.push(fn)
+    }
+  }
+
+  subscribeForLast(fn: Update<T>) {
+    if (this.pub) {
+      this.pub.subscribeForLast(fn)
+    } else {
+      this.lastSubscriptions.push(fn)
+    }
+  }
+}
+
+/**
+ * A published value
+ */
+export class Publication<T> {
+
+  readonly name: string
+  private subscriptions = new Array<Update<T>>()
+  private firstSubscriptions = new Array<Update<T>>()
+  private lastSubscriptions = new Array<Update<T>>()
+  private publishedValues: T[] = new Array<T>()
+  private closed = false
+
+  constructor(name: string, value: T = null) {
+    this.name = name
+    if (value !== null) { this.publishedValues.push(value)}
+  }
+
+  get value(): T | null {
+    return this.last
+  }
+
+  get length() {
+    return this.publishedValues.length
+  }
+
+  get first(): T | null {
+    if (this.length > 0) {
+      return this.publishedValues[0]
+    } else {
+      return null
+    }
+  }
+
+  get last(): T | null {
+    if (this.length > 0) {
+      return this.publishedValues[this.length - 1]
+    } else {
+      return null
+    }
+  }
+
+  close() {
+    this.closed = true
+    this.lastSubscriptions.forEach((sub) => sub(this.last))
+  }
+
+  update(value: T) {
+    if (this.length === 0) {
+      this.firstSubscriptions.forEach((updateFunction) => updateFunction(value))
+    }
+    this.publishedValues.push(value)
+    this.subscriptions.forEach((updateFunction) => updateFunction(value))
+  }
+
+  subscribe(fn: Update<T>) {
+    this.subscriptions.push(fn)
+    if (this.length > 0) {
+      setTimeout(() => {this.publishedValues.forEach((v) => fn(v))}, 0)
+    }
+  }
+
+  subscribeForFirst(fn: Update<T>) {
+    this.firstSubscriptions.push(fn)
+    if (this.first) {
+      setTimeout(() => {fn(this.first)}, 0)
+    }
+  }
+
+  subscribeForLast(fn: Update<T>) {
+    this.lastSubscriptions.push(fn)
+    if (this.closed) {
+      setTimeout(() => {fn(this.last)}, 0)
+    }
+  }
+
+  printAll() {
+    this.publishedValues.forEach((p: T, i: number) => {console.log(`${i}: ${JSON.stringify(p)}`)})
+    console.log()
+  }
+}
diff --git a/src/publisher.ts b/src/publish.ts
similarity index 53%
rename from src/publisher.ts
rename to src/publish.ts
index 102eccd..1afd4d2 100644
--- a/src/publisher.ts
+++ b/src/publish.ts
@@ -1,6 +1,7 @@
-import { PUB_REQUEST_EVENT_NAME, PublicationRequest, Update } from './subscriber.js'
+import { PUB_REQUEST_EVENT_NAME } from './index.js'
+import { Publication, PublicationRequest } from './publication.js'
 
-export function publisher(parent: HTMLElement | ShadowRoot) {
+export function publish(parent: HTMLElement | ShadowRoot) {
   /**
    * Expose a Subscibable over events
    * @param name
@@ -8,7 +9,7 @@ export function publisher(parent: HTMLElement | ShadowRoot) {
    * @param parent
    */
   return {
-    create: function createPublication<T>(name: string, initialValue: T | null): Publication<T> {
+    create: function createPublication<T>(name: string, initialValue?: T | null | undefined): Publication<T> {
       const publication = new Publication<T>(name, initialValue)
 
       const requestListener = (event: CustomEvent) => {
@@ -28,31 +29,3 @@ export function publisher(parent: HTMLElement | ShadowRoot) {
     }
   }
 }
-
-/**
- * A published value
- */
-export class Publication<T> {
-
-  readonly name: string
-  private subscriptions = new Array<Update<T>>()
-  private publishedValue: T | null | undefined
-
-  constructor(name: string, value: T | null) {
-    this.name = name
-    this.publishedValue = value
-  }
-
-  get value(): T | undefined | null {
-    return this.publishedValue
-  }
-
-  update(value: T | null | undefined) {
-    this.publishedValue = value
-    this.subscriptions.forEach((val) => val(this.value))
-  }
-
-  subscribe(fn: Update<T>) {
-    this.subscriptions.push(fn)
-  }
-}
diff --git a/src/subscribe.ts b/src/subscribe.ts
new file mode 100644
index 0000000..d7f3fe2
--- /dev/null
+++ b/src/subscribe.ts
@@ -0,0 +1,153 @@
+import { PUB_REQUEST_EVENT_NAME } from './index.js'
+import { PublicationRequest } from './publication.js'
+
+/**
+ * Subscribe to an observable. In most cases, passing `this` is recommended. The observable provider should be
+ * somewhere up the DOM tree from the provided `child`.
+ * @param descendant `HTMLElelement` or `ShadowRoot` descendant of observable provider
+ */
+export function subscribe(descendant: HTMLElement | ShadowRoot) {
+
+  /**
+   * Subscribe for changes to a subscibable. The update is called once on subscription to get the initial value.
+   * @param name pub name
+   * @param update function called once each time the pub changes
+   * @param retry retry getting a handle on publication if it is not yet available.
+   */
+
+  return {
+    /**
+     * Identify by name the observable you are interested in. Use `T` generic to define the type of the observable.
+     * @param name unique observable identifier
+     *
+     */
+    to: function to<T>(name: string): To<T> { return new To<T>(name, descendant)}
+  }
+
+}
+
+/**
+ * Publication update callback
+ */
+export type Update<T> = (updated: T | null) => void
+
+/**
+ * Wrapper around subscription interface
+ */
+class To<T> {
+  name: string
+  target: HTMLElement | ShadowRoot
+
+  constructor(name: string, target: HTMLElement | ShadowRoot) {
+    this.name = name
+    this.target = target
+  }
+
+  /**
+   * Map the values as they are updated. Whether the update is a replacement for a single value or a stream of values
+   * is determined by the
+   * observsable provider.
+   * @param fn {@link Update}
+   */
+  map(fn: Update<T>): To<T> {
+    connect(
+      this.name,
+      true,
+      (pub: PublicationRequest<T>) => {
+        pub.subscribe(fn)
+      },
+      this.target)
+
+    return this
+  }
+
+  /**
+   * Map the first update only. Useful if the first update should trigger special processing OR if only a single update
+   * is expected.
+   * @param fn {@link Update}
+   */
+  mapFirst(fn: Update<T>): To<T> {
+    connect(
+      this.name,
+      true,
+      (pub: PublicationRequest<T>) => {
+        pub.subscribeForFirst(fn)
+      },
+      this.target)
+
+    return this
+  }
+
+  /**
+   *
+   * @param fn {@link Update}
+   */
+  mapLast(fn: Update<T>): To<T> {
+    connect(
+      this.name,
+      true,
+      (pub: PublicationRequest<T>) => {
+        pub.subscribeForLast(fn)
+      },
+      this.target)
+    return this
+  }
+
+  /**
+   * Map first value as a promise. This is useful to retrieve a service or a singleton.
+   */
+  toPromise(): Promise<T> {
+    return new Promise<T>((resolve) => {
+      this.mapFirst(updated => resolve(updated))
+    })
+  }
+}
+
+/**
+ * Connection strategy that connect observer and observable over events
+ * @param name observable name
+ * @param retry
+ * @param beginFn startup behavior once observable captured
+ * @param descendant
+ */
+function connect<T>(name: string,
+                    retry: boolean,
+                    beginFn: (pub: PublicationRequest<T>) => void,
+                    descendant: HTMLElement | ShadowRoot): PublicationRequest<T> {
+
+  const publication = new PublicationRequest<T>(name)
+
+  // create custom event request
+  const requestEvent = new CustomEvent(
+    PUB_REQUEST_EVENT_NAME,
+    {
+      detail: publication,
+      bubbles: true,
+      cancelable: true,
+      composed: true
+    })
+
+  // seek the observable provider somewhere up the DOM
+  descendant.dispatchEvent(requestEvent)
+
+  retryUntilThere(10, retry)
+
+  /**
+   * retry reaching observable at intervals. Retries delay grows after each failed attempt
+   * @param initialTimeout initial timeout.
+   * @param shouldRetry try more than once
+   */
+  function retryUntilThere(initialTimeout: number, shouldRetry: boolean) {
+    // check if provider has filled value
+    if (publication.value == null) {
+      setTimeout(() => {
+        descendant.dispatchEvent(requestEvent)
+        if (shouldRetry) retryUntilThere((initialTimeout * 5), shouldRetry)
+      }, initialTimeout)
+    } else {
+      beginFn(publication)
+    }
+  }
+
+  return publication
+}
diff --git a/src/subscriber.test.ts b/src/subscriber.test.ts
new file mode 100644
index 0000000..0edf2a1
--- /dev/null
+++ b/src/subscriber.test.ts
@@ -0,0 +1,40 @@
+import { Publication, PublicationRequest } from './publication.js'
+
+describe('subscriber', function() {
+  this.enableTimeouts()
+  const expect = chai.expect
+
+  describe('Sub', function() {
+
+    it('should register subscriptions', function() {
+      let subAll: number
+      const request = new PublicationRequest<number>('test')
+      request.pub = new Publication<number>('test')
+      request.subscribe((up: number) => {subAll = up})
+      request.pub.update(999)
+
+      chai.expect(subAll).to.equal(999)
+
+    })
+
+    it('should register early subscriptions', function() {
+      let subAll: number
+      let subFirst: number
+      let subLast: number
+      const request = new PublicationRequest<number>('test')
+      request.subscribe((up: number) => {subAll = up})
+      request.subscribeForFirst((up: number) => {subFirst = up})
+      request.subscribeForLast((up: number) => {subLast = up})
+
+      request.pub = new Publication<number>('test')
+      request.pub.update(999)
+      request.pub.close()
+
+      chai.expect(subFirst).to.equal(999)
+      chai.expect(subAll).to.equal(999)
+      chai.expect(subLast).to.equal(999)
+
+    })
+
+  })
+})
diff --git a/src/subscriber.ts b/src/subscriber.ts
deleted file mode 100644
index 2ca716e..0000000
--- a/src/subscriber.ts
+++ /dev/null
@@ -1,79 +0,0 @@
-import { Publication } from './publisher.js'
-export const PUB_REQUEST_EVENT_NAME: string = 'subscribablerequest'
-
-export function subscriber(parent: HTMLElement | ShadowRoot) {
-  /**
-   * Subscribe for changes to a subscibable. The update is called once on subscription to get the initial value.
-   * @param name pub name
-   * @param update function called once each time the pub changes
-   * @param retry retry getting a handle on publication if it is not yet available.
-   */
-  return {
-    request: function request<T>(name: string, update: Update<T>, retry: boolean = true) {
-      const publication = new PublicationRequest<T>(name)
-      // console.debug('SETUP SUB: ' + publication.name)
-
-      // seek a parent that provides this publication
-      const event = new CustomEvent(
-        PUB_REQUEST_EVENT_NAME,
-        {
-          detail: publication,
-          bubbles: true,
-          cancelable: true,
-          composed: true
-        })
-
-      // request the publication
-      parent.dispatchEvent(event)
-
-      tryIt(10)
-
-      function tryIt(timeout: number) {
-        if (publication.value == null) {
-          setTimeout(() => {
-            // console.debug('RETRY SUB: ' + publication.name)
-            parent.dispatchEvent(event)
-            if (retry) tryIt((timeout * 5))
-          }, timeout)
-        } else {
-          begin()
-        }
-      }
-
-      function begin() {
-        // subscribe for updates
-        publication.subscribe(update)
-
-        // force publish initial value
-        update(publication.value)
-      }
-
-    }
-  }
-
-}
-
-/**
- * Request for publication to subscribe to
- */
-export class PublicationRequest<T> {
-  readonly name: string
-  pub?: Publication<T>
-
-  constructor(name: string) {
-    this.name = name
-  }
-
-  get value(): T | null | undefined {
-    return this.pub ? this.pub.value : null
-  }
-
-  subscribe(update: Update<T>) {
-    return this.pub ? this.pub.subscribe(update) : null
-  }
-}
-
-/**
- * Publication update callback
- */
-export type Update<T> = (updated: T | null | undefined) => void
diff --git a/test/Counter.js b/test/Counter.js
deleted file mode 100644
index eaa0794..0000000
--- a/test/Counter.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import { Selector } from 'testcafe';
-
-fixture `Counter`
-  .page `http://localhost:8888/src/example/di/index.html`;
-
-test('Increment counter', async t => {
-  await t
-    .click(".b")
-    .click('.b')
-      .expect(Selector('.value').textContent).eql('2');
-});
diff --git a/test/Streaming.js b/test/Streaming.js
deleted file mode 100644
index c5035e3..0000000
--- a/test/Streaming.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import { Selector } from 'testcafe'
-
-fixture`Streams`.page`http://localhost:8888/src/example/streaming/index.html`
-
-test('all 5 prices are received', async t => {
-
-    let apples = await Selector('.apples')
-    let oranges = await Selector('.oranges')
-    let bananas = await Selector('.bananas')
-    let grapes = await Selector('.grapes')
-    let kiwis = await Selector('.kiwis')
-
-    await t.expect(apples)
-      .ok()
-      .expect(apples.textContent)
-      .contains('apples:')
-      .expect(oranges)
-      .ok()
-      .expect(oranges.textContent)
-      .contains('oranges:')
-      .expect(bananas)
-      .ok()
-      .expect(bananas.textContent)
-      .contains('bananas:')
-      .expect(grapes)
-      .ok()
-      .expect(grapes.textContent)
-      .contains('grapes:')
-      .expect(kiwis)
-      .ok()
-      .expect(kiwis.textContent)
-      .contains('kiwis:')
-  },
-)
-test('prices change', async t => {
-    await t.wait(1500)
-    let apples = await Selector('.apples')
-    let applePrice = await apples.textContent
-
-    let kiwis = await Selector('.kiwis')
-    let kiwiPrice = await kiwis.textContent
-
-    let change = await Selector('.change')
-    let priceChange = await change.textContent
-
-    await t.wait(1500)
-    let p = await Selector('.apples').textContent
-
-    await t.expect(applePrice)
-      .notEql(p)
-      .expect((kiwiPrice))
-      .notEql(Selector('.kiwis').textContent)
-      .expect((priceChange))
-      .notEql(Selector('.change').textContent)
-
-    priceChange = await change.textContent
-
-    await t.wait(1500)
-      .expect((priceChange))
-      .notEql(Selector('.change').textContent)
-  },
-)
diff --git a/test/pptr.js b/test/pptr.js
deleted file mode 100644
index 7eab717..0000000
--- a/test/pptr.js
+++ /dev/null
@@ -1,12 +0,0 @@
-const puppeteer = require('puppeteer');
-
-
-(async () => {
-  const browser = await puppeteer.launch()
-  const page = await browser.newPage()
-  await page.goto('http://localhost:8888/src/example/streaming/index.html')
-  await page.waitFor('.apples')
-  await page.screenshot({ path: 'example.png' })
-
-  await browser.close()
-})()
diff --git a/tslint.json b/tslint.json
index 3c6523b..ef4f1c7 100644
--- a/tslint.json
+++ b/tslint.json
@@ -41,7 +41,7 @@
         "forin"                   : false,
         "arrow-parens"            : false,
         "only-arrow-functions"    : [
-            true,
+            false,
             "allow-declarations",
             "allow-named-functions"
         ],