diff --git a/packages/core/src/interactions/Draggable.ts b/packages/core/src/interactions/Draggable.ts index d472c5f1..f148197a 100644 --- a/packages/core/src/interactions/Draggable.ts +++ b/packages/core/src/interactions/Draggable.ts @@ -178,7 +178,7 @@ export class Draggable { (downEvent.target as Element).setPointerCapture(downEvent.pointerId); } - moveSubscription = move$.merge({ others: [ up$ ] })._filter({ + moveSubscription = move$.merge([ up$ ])._filter({ predicate: (nextEvent: PartialPointerEvent) => nextEvent.pointerId === downEvent.pointerId }).subscribe( (nextEvent: PartialPointerEvent) => { @@ -251,13 +251,11 @@ export class Draggable { } ); - cancellationSubscription = this.cancellation$.merge({ - others: [ - when(not(this.enabled$)), - cancel$, - contextMenu$, - ] - }).subscribe( + cancellationSubscription = this.cancellation$.merge([ + when(not(this.enabled$)), + cancel$, + contextMenu$, + ]).subscribe( () => { if (moveSubscription) { moveSubscription.unsubscribe(); diff --git a/packages/core/src/interactions/Swipeable.ts b/packages/core/src/interactions/Swipeable.ts index 4e6bccef..c779e0a9 100644 --- a/packages/core/src/interactions/Swipeable.ts +++ b/packages/core/src/interactions/Swipeable.ts @@ -183,13 +183,11 @@ export class Swipeable { subscribe({ sink: spring.enabled$, - source: this.whenThresholdFirstCrossed$.merge({ - others: [ - when(spring.state$.isAnyOf([ State.AT_REST ])).rewriteTo({ - value$: false, - }) - ] - }), + source: this.whenThresholdFirstCrossed$.merge([ + when(spring.state$.isAnyOf([ State.AT_REST ])).rewriteTo({ + value$: false, + }) + ]), }); subscribe({ diff --git a/packages/core/src/operators/__tests__/merge.test.ts b/packages/core/src/operators/__tests__/merge.test.ts index 0ba0baa4..4df2450e 100644 --- a/packages/core/src/operators/__tests__/merge.test.ts +++ b/packages/core/src/operators/__tests__/merge.test.ts @@ -75,5 +75,23 @@ describe('motionObservable.merge', expect(listener).to.have.been.calledWith(4); } ); + + it('should have a shorthand signature', + () => { + stream1.merge([ stream2, stream3 ]).subscribe(listener); + + mockObserver1.next(1); + expect(listener).to.have.been.calledOnce.and.calledWith(1); + + mockObserver3.next(3); + expect(listener).to.have.been.calledTwice.and.calledWith(3); + + mockObserver2.next(2); + expect(listener).to.have.been.calledThrice.and.calledWith(2); + + mockObserver1.next(4); + expect(listener).to.have.been.calledWith(4); + } + ); } ); diff --git a/packages/core/src/operators/merge.ts b/packages/core/src/operators/merge.ts index 7538d1aa..914e7cfb 100644 --- a/packages/core/src/operators/merge.ts +++ b/packages/core/src/operators/merge.ts @@ -25,15 +25,20 @@ import { Observer, } from '../types'; +import { + isDefined, +} from '../typeGuards'; + import { createPlucker, } from './pluck'; export type MergeArgs = { - others: Array> + others: Array>, }; export interface MotionMergeable extends Observable { + merge(others: Array>): ObservableWithMotionOperators; merge(kwargs: MergeArgs): ObservableWithMotionOperators; } @@ -43,7 +48,13 @@ export function withMerge>>(superclass: S * Dispatches values as it receives them, both from upstream and from any * streams provided as arguments. */ - merge({ others }: MergeArgs): ObservableWithMotionOperators { + merge(others: Array>): ObservableWithMotionOperators; + merge(kwargs: MergeArgs): ObservableWithMotionOperators; + merge({ others }: MergeArgs & Array>): ObservableWithMotionOperators { + if (!isDefined(others)) { + others = arguments[0]; + } + return new MotionObservable( (observer: Observer) => { const subscriptions = [this, ...others].map( diff --git a/packages/views-dom/src/getPointerEventStreamsFromElement.ts b/packages/views-dom/src/getPointerEventStreamsFromElement.ts index 8a2cf055..f8f576f0 100644 --- a/packages/views-dom/src/getPointerEventStreamsFromElement.ts +++ b/packages/views-dom/src/getPointerEventStreamsFromElement.ts @@ -53,27 +53,21 @@ export function getPointerEventStreamsFromElement(element: Element): PointerEven }; } else { return { - down$: getEventStreamFromElement('mousedown', element).merge({ - others: [ - convertTouchEventsToPointerEvents( - getEventStreamFromElement('touchstart', element) - ), - ], - }), - move$: getEventStreamFromElement('mousemove', element).merge({ - others: [ - convertTouchEventsToPointerEvents( - getEventStreamFromElement('touchmove', element) - ), - ], - }), - up$: getEventStreamFromElement('mouseup', element).merge({ - others: [ - convertTouchEventsToPointerEvents( - getEventStreamFromElement('touchend', element) - ), - ], - }), + down$: getEventStreamFromElement('mousedown', element).merge([ + convertTouchEventsToPointerEvents( + getEventStreamFromElement('touchstart', element) + ), + ]), + move$: getEventStreamFromElement('mousemove', element).merge([ + convertTouchEventsToPointerEvents( + getEventStreamFromElement('touchmove', element) + ), + ]), + up$: getEventStreamFromElement('mouseup', element).merge([ + convertTouchEventsToPointerEvents( + getEventStreamFromElement('touchend', element) + ), + ]), cancel$: convertTouchEventsToPointerEvents( getEventStreamFromElement('touchcancel', element) ),