import { Observable } from '../Observable'; import { EmptyError } from '../util/EmptyError'; import { OperatorFunction, TruthyTypesOf } from '../types'; import { filter } from './filter'; import { take } from './take'; import { defaultIfEmpty } from './defaultIfEmpty'; import { throwIfEmpty } from './throwIfEmpty'; import { identity } from '../util/identity'; export function first(predicate?: null, defaultValue?: D): OperatorFunction; export function first(predicate: BooleanConstructor): OperatorFunction>; export function first(predicate: BooleanConstructor, defaultValue: D): OperatorFunction | D>; export function first( predicate: (value: T, index: number, source: Observable) => value is S, defaultValue?: S ): OperatorFunction; export function first( predicate: (value: T, index: number, source: Observable) => value is S, defaultValue: D ): OperatorFunction; export function first( predicate: (value: T, index: number, source: Observable) => boolean, defaultValue?: D ): OperatorFunction; /** * Emits only the first value (or the first value that meets some condition) * emitted by the source Observable. * * Emits only the first value. Or emits only the first * value that passes some test. * * ![](first.png) * * If called with no arguments, `first` emits the first value of the source * Observable, then completes. If called with a `predicate` function, `first` * emits the first value of the source that matches the specified condition. Throws an error if * `defaultValue` was not provided and a matching element is not found. * * ## Examples * * Emit only the first click that happens on the DOM * * ```ts * import { fromEvent, first } from 'rxjs'; * * const clicks = fromEvent(document, 'click'); * const result = clicks.pipe(first()); * result.subscribe(x => console.log(x)); * ``` * * Emits the first click that happens on a DIV * * ```ts * import { fromEvent, first } from 'rxjs'; * * const div = document.createElement('div'); * div.style.cssText = 'width: 200px; height: 200px; background: #09c;'; * document.body.appendChild(div); * * const clicks = fromEvent(document, 'click'); * const result = clicks.pipe(first(ev => (ev.target).tagName === 'DIV')); * result.subscribe(x => console.log(x)); * ``` * * @see {@link filter} * @see {@link find} * @see {@link take} * * @throws {EmptyError} Delivers an EmptyError to the Observer's `error` * callback if the Observable completes before any `next` notification was sent. * This is how `first()` is different from {@link take}(1) which completes instead. * * @param {function(value: T, index: number, source: Observable): boolean} [predicate] * An optional function called with each item to test for condition matching. * @param {D} [defaultValue] The default value emitted in case no valid value * was found on the source. * @return A function that returns an Observable that emits the first item that * matches the condition. */ export function first( predicate?: ((value: T, index: number, source: Observable) => boolean) | null, defaultValue?: D ): OperatorFunction { const hasDefaultValue = arguments.length >= 2; return (source: Observable) => source.pipe( predicate ? filter((v, i) => predicate(v, i, source)) : identity, take(1), hasDefaultValue ? defaultIfEmpty(defaultValue!) : throwIfEmpty(() => new EmptyError()) ); }