src/components/ebay-dialog/index.js
function trap(opts) {
    const { isTrapped: wasTrapped, restoreTrap } = this;
    const isTrapped = this.isTrapped = this.state.open;
    const isFirstRender = (opts && opts.firstRender);
    const wasToggled = isTrapped !== wasTrapped;
    const focusEl = (this.state.focus && document.getElementById(this.state.focus)) || this.closeEl;

    if (restoreTrap || (isTrapped && !wasTrapped)) {
        screenReaderTrap.trap(this.windowEl);
        keyboardTrap.trap(this.windowEl);
    }

    // Ensure focus is set and body scroll prevented on initial render.
    if (isFirstRender && isTrapped) {
        focusEl.focus();
        bodyScroll.prevent();
    }

    if (wasToggled) {
        cancelAsync.call(this);
        const onFinishTransition = () => {
            this.cancelTransition = undefined;

            if (isTrapped) {
                focusEl.focus();
                emitAndFire(this, 'dialog-show');
            } else {
                bodyScroll.restore();
                emitAndFire(this, 'dialog-close');

                // Reset dialog scroll position lazily to avoid jank.
                // Note since the dialog is not in the dom at this point none of the scroll methods will work.
                this.cancelScrollReset = setTimeout(() => {
                    this.dialogEl.parentNode.replaceChild(this.dialogEl, this.dialogEl);
                    this.cancelScrollReset = undefined;
                }, 20);
            }
        };

        if (isTrapped) {
            if (!isFirstRender) {
                bodyScroll.prevent();
                this.cancelTransition = transition({
                    el: this.dialogEl,
                    className: 'dialog--show',
                    waitFor: this.transitionEls
                }, onFinishTransition);
            }

            this.dialogEl.removeAttribute('hidden');
        } else {
            if (!isFirstRender) {
                this.cancelTransition = transition({
                    el: this.dialogEl,
                    className: 'dialog--hide',
                    waitFor: this.transitionEls
                }, onFinishTransition);
            }

            this.dialogEl.setAttribute('hidden', '');
        }
    }
}
function trap(opts) {
    const { isTrapped: wasTrapped, restoreTrap } = this;
    const isTrapped = this.isTrapped = this.state.open;
    const isFirstRender = (opts && opts.firstRender);
    const wasToggled = isTrapped !== wasTrapped;
    const focusEl = (this.state.focus && document.getElementById(this.state.focus)) || this.closeEl;

    if (restoreTrap || (isTrapped && !wasTrapped)) {
        screenReaderTrap.trap(this.windowEl);
        keyboardTrap.trap(this.windowEl);
    }

    // Ensure focus is set and body scroll prevented on initial render.
    if (isFirstRender && isTrapped) {
        focusEl.focus();
        bodyScroll.prevent();
    }

    if (wasToggled) {
        cancelAsync.call(this);
        const onFinishTransition = () => {
            this.cancelTransition = undefined;

            if (isTrapped) {
                focusEl.focus();
                emitAndFire(this, 'dialog-show');
            } else {
                bodyScroll.restore();
                emitAndFire(this, 'dialog-close');

                // Reset dialog scroll position lazily to avoid jank.
                // Note since the dialog is not in the dom at this point none of the scroll methods will work.
                this.cancelScrollReset = setTimeout(() => {
                    this.dialogEl.parentNode.replaceChild(this.dialogEl, this.dialogEl);
                    this.cancelScrollReset = undefined;
                }, 20);
            }
        };

        if (isTrapped) {
            if (!isFirstRender) {
                bodyScroll.prevent();
                this.cancelTransition = transition({
                    el: this.dialogEl,
                    className: 'dialog--show',
                    waitFor: this.transitionEls
                }, onFinishTransition);
            }

            this.dialogEl.removeAttribute('hidden');
        } else {
            if (!isFirstRender) {
                this.cancelTransition = transition({
                    el: this.dialogEl,
                    className: 'dialog--hide',
                    waitFor: this.transitionEls
                }, onFinishTransition);
            }

            this.dialogEl.setAttribute('hidden', '');
        }
    }
}
function trap ( opts ) { const { isTrapped : wasTrapped , restoreTrap } = this ; const isTrapped = this . isTrapped = this . state . open ; const isFirstRender = ( opts && opts . firstRender ) ; const wasToggled = isTrapped !== wasTrapped ; const focusEl = ( this . state . focus && document . getElementById ( this . state . focus ) ) || this . closeEl ; if ( restoreTrap || ( isTrapped && ! wasTrapped ) ) { screenReaderTrap . trap ( this . windowEl ) ; keyboardTrap . trap ( this . windowEl ) ; } // Ensure focus is set and body scroll prevented on initial render. if ( isFirstRender && isTrapped ) { focusEl . focus ( ) ; bodyScroll . prevent ( ) ; } if ( wasToggled ) { cancelAsync . call ( this ) ; const onFinishTransition = ( ) => { this . cancelTransition = undefined ; if ( isTrapped ) { focusEl . focus ( ) ; emitAndFire ( this , 'dialog-show' ) ; } else { bodyScroll . restore ( ) ; emitAndFire ( this , 'dialog-close' ) ; // Reset dialog scroll position lazily to avoid jank. // Note since the dialog is not in the dom at this point none of the scroll methods will work. this . cancelScrollReset = setTimeout ( ( ) => { this . dialogEl . parentNode . replaceChild ( this . dialogEl , this . dialogEl ) ; this . cancelScrollReset = undefined ; } , 20 ) ; } } ; if ( isTrapped ) { if ( ! isFirstRender ) { bodyScroll . prevent ( ) ; this . cancelTransition = transition ( { el : this . dialogEl , className : 'dialog--show' , waitFor : this . transitionEls } , onFinishTransition ) ; } this . dialogEl . removeAttribute ( 'hidden' ) ; } else { if ( ! isFirstRender ) { this . cancelTransition = transition ( { el : this . dialogEl , className : 'dialog--hide' , waitFor : this . transitionEls } , onFinishTransition ) ; } this . dialogEl . setAttribute ( 'hidden' , '' ) ; } } }
Ensures that if a component is supposed to be trapped that this is
trapped after rendering.
Ensures that if a component is supposed to be trapped that this is trapped after rendering .