observable-callback

1.0.3 verified Sat May 09 auth: no javascript

A small RxJS utility (v1.0.3, stable) that creates a callback function which publishes its argument to an observable stream. It wraps an RxJS Subject and returns a tuple of the subject's observable and its next() function. Also supports an optional operator function to transform the observable. Minimal, no other dependencies besides RxJS 6.x or 7.x. Ideal for converting callback-based APIs (e.g., React event handlers) into observable streams.

Common errors

error Cannot find module 'observable-callback' or its corresponding type declarations. ↓

cause The package may not be installed or TypeScript cannot resolve it due to missing node_modules or incorrect moduleResolution.

fix

Run npm install observable-callback. Ensure tsconfig has moduleResolution: 'node' or 'node16' and esModuleInterop true.

error Module not found: Error: Can't resolve 'observable-callback' ↓

cause CommonJS require used in a bundler that cannot resolve ESM-only package.

fix

Use import syntax or configure bundler to handle ESM (e.g., webpack with experiments.outputModule).

error TypeError: observableCallback is not a function ↓

cause Incorrect import style: using default import or destructuring from wrong object.

fix

Use named import: import { observableCallback } from 'observable-callback'.

Warnings

breaking v1.0.2 added support for rxjs@7 as peer dependency. v1.0.0 only supported rxjs@6. ↓

fix Upgrade to v1.0.2+ or keep rxjs@6.

gotcha The callback function is the Subject's next method; calling it with no argument or multiple arguments may cause unexpected behavior since Subject.next expects a single argument. ↓

fix Always call with exactly one argument of the expected type.

gotcha If the operator function is provided, the first element of the tuple is the observable from operator's result, not the raw subject observable. This may confuse developers expecting the raw subject observable. ↓

fix When passing an operator, the returned observable is the transformed one; reference the operator if you need the raw subject.

Install

npm install observable-callback

yarn add observable-callback

pnpm add observable-callback

Imports

observableCallback
wrong
```
const observableCallback = require('observable-callback')
```
correct
```
import { observableCallback } from 'observable-callback'
```
Package is ESM-only; named import required. CommonJS require will fail unless using a bundler that handles ESM.

Observable

wrong

import { Observable } from 'observable-callback'

correct

import { Observable } from 'rxjs'

Observable type is not re-exported; must be imported from rxjs.

OperatorFunction
wrong
```
import { OperatorFunction } from 'observable-callback'
```
correct
```
import { OperatorFunction } from 'rxjs'
```
OperatorFunction type used in the overloaded signature; import from rxjs.

Quickstart

Shows creation of observable-callback, subscription, invoking callback, and usage with operator and in React.

import { observableCallback } from 'observable-callback';
import { map } from 'rxjs/operators';

// Basic usage: create callback and observable
const [value$, onValue] = observableCallback();
value$.subscribe(value => console.log(value)); // logs 'Hi'
onValue('Hi');

// With operator: transform stream
const [greeting$, onPlanet] = observableCallback(
  planet$ => planet$.pipe(map(planet => `Hello ${planet}!`))
);
greeting$.subscribe(console.log); // logs 'Hello world!'
onPlanet('world');

// React example
import React from 'react';
const [clicks$, onClick] = observableCallback();
clicks$.subscribe(() => console.log('clicked'));
const Button = () => <button onClick={onClick}>Click me</button>;